Question

我是javascript的新手，所以让我直接说出来。

我经常在一个网站上有50个左右的项目，有关该项目的详细信息。每个表行包含几个td单元格。有些行有类似的东西，比如USB驱动器或其他什么。我想捕捉每一行，以便我可以对它们进行分组和重新排序以符合我的口味。

我有这个对象：

function vnlItemOnPage(){
  this.Category = "unknown";
  this.ItemClass = "vnlDefaultClass";
  this.ItemBlock = {};
}

这代表一行。

我一直想弄清楚的是如何捕获html < tr>stuff< /tr>的块并将其保存到this.ItemBlock。

这部分很简单：

vnlItemOnPage.ItemBlock = element.getElementByClassName('className')[0]

这看起来非常简单。我错过了什么吗？

这部分我被困住了：

它们中有50个，所以我需要一个vnlItemOnPage数组？

vnlAllItems = ???

var vnlAllItems = [vnlItemOnPage]?

而且，我将如何添加到数组并从数组中删除？我可能不会从数组中删除，如果这很复杂，请不要理会它。

一旦我捕获＆lt; TR＆GT; html，我可以将它附加到像这样的表元素：

myTable.appendChild(vnlAllItems[0].ItemBlock);

正确？

如果你认为我从错误的方向接近这个问题，我愿意接受任何建议。性能不是一个大问题 - 至少现在。后来我可能会尝试将几个页面混合成几百个项目。

感谢您的协助！

[编辑]

也许问题的第二部分是如此基本，很难相信我不知道答案。

数组可以是：var vnlAllItems = []

然后它只是： var row1 = new vnlItemOnPage; vnlAllItems.push（ROW1）; var row2 = new vnlItemOnPage; row2.ItemBlock = element.getElementByClassName（'className'）[0];

我想关闭这个问题，但我讨厌这样做而没有关于处理数组的事情。

Answer 1

JQuery是你的朋友。

这将为您提供所需表格正文中第一行的内部HTML：

var rowHtml = $('table#id-of-desired-table tbody tr:first').html() ;

要获取外部HTML，您需要一个jQuery扩展方法：

jQuery.fn.outerHTML = function() {
  return $('<div>').append( this.eq(0).clone() ).html();
};

用法很简单：

var rowHtml = $('table#id-of-desired-table tbody tr:first').outerHtml() ;

享受！

Answer 2

不确定它是否正在寻找，但如果我想操纵表格行，我会存储：

Row的整个html <td>1</td>...<td>n</td>为字符串，因此我可以快速重建行
对于每一行存储实际单元格值[1, ..., n]，所以我可以使用值进行一些操作（排序）

要将行设为html，您可以使用：

var rowHtml = element.getElementByClassName('className')[0].innerHTML;

要获取可以使用的单元格值数组：

var cells = [];
var cellElements = element.getElementByClassName('className')[0].cells;
for(var i=0;i<cellElements.length;i++) {
    cells.push(cellElements[i].innerText);
}

所以存储所有这些的对象看起来像是：

function vnlItemOnPage(){
  this.Category = "unknown";
  this.ItemClass = "vnlDefaultClass";
  this.RowHtml = "";
  this.RowCells = [];
}

对象 - 对象中的对象 - 这些对象的数组

2 个答案: