1

我正在尝试使用 Prototype 的 New Element 函数构建一个表。当我用完整的内容更新 thead 时，我在 Firefox 中遇到了问题：所有元素加上内容。Firefox 正在剥离标签并仅显示内容。

无论如何，我决定构造每一个 th 元素，然后使用该Element.update()函数将其附加到 thead 中。但我还没有找到用这个函数附加多个对象的方法。

第 th 个元素如下所示：

var thead_amount = new Element('th', {
    'id': 'amount'
}).update('amount');

这工作正常：

new Element('thead').update(thead_amount);

这输出与上面相同：

new Element('thead').update(thead_amount, thead_pdf, thead_tags, thead_date, thead_options);

这输出[object HTMLTableCellElement][object HTMLTableCellElement][object HTMLTableCellElement][object HTMLTableCellElement][object HTMLTableCellElement]

new Element('thead').update(thead_amount + thead_pdf + thead_tags + thead_date + thead_options);

如何使用 Prototype 的update()函数附加多个对象？

谢谢！

4

1 回答 1

1

编辑

我突然想到你正在将“TH”元素添加到“THEAD”中。这是不好的！一个 THEAD 应该只包含 TR。TR 可以包含 TH，但如果您使用的是 THEAD，我会使用 TD。

请记住：tbody、thead 和 tfoot 是 table 的细分，并且必须包含 tr 元素。您不应将 td 或 th 元素直接放入其中，因为结果充其量是不可预测的。

结束编辑

这里的问题是 Element.update() 必须传递一个字符串、HTML 片段或实现 toString 的 javascript 对象（例如 Element）。但是，Element 在您使用它时不支持“+”运算符，而是将您看到的对象名称加在一起。您必须像这样显式调用每个孩子的 toString 方法：

new Element('thead').update(thead_amount.toString()
  + thead_pdf.toString() 
  + thead_tags.toString() 
  + thead_date.toString() 
  + thead_options.toString());

如果您在应用程序中使用 script.aculo.us（Prototype 扩展），您可以使用 Builder 类来帮助更轻松地构建元素。它提供了更直观的界面，尤其是在创建大量元素时。这是一个例子：

var table = Builder.node('table', {
  width: '100%',
  cellpadding: '2',
  cellspacing: '0',
  border: '0'
});

var tbody = Builder.node('tbody'),
    tr = Builder.node('tr', { className: 'header' }),
    td = Builder.node('td', [Builder.node('strong', 'Category')]);

tr.appendChild(td);
tbody.appendChild(tr);
table.appendChild(tbody);

$('divCat').appendChild(table);

查看http://wiki.github.com/madrobby/scriptaculous/builder了解详情。

于 2009-07-21T20:11:51.040 回答