原型Element.update多个对象

问题描述

我试图构建具有原型的新元素功能表。我正经历着在Firefox的问题时，我是用完整的内容更新THEAD：所有th元素加内容。火狐只是剥离标记和显示的内容。

I'm trying to construct a table with Prototype's New Element function. I was experiencing problems in Firefox when I was updating the thead with the complete content: all th elements plus contents. Firefox was stripping the tags and displays only the contents.

反正我决定建设的每一个个元素，然后将其附加到利用 Element.update（）功能THEAD。但我还没有找到一种方法，多个对象追加使用此功能。

Anyways I decided to construct every single th element and then append it to the thead utilizing the Element.update() function. But I haven't found a way to append multiple objects with this function.

在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);

此输出 [对象HTMLTableCellElement] [对象HTMLTableCellElement] [对象HTMLTableCellElement] [对象HTMLTableCellElement] [对象HTMLTableCellElement]

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

我

如何添加多个对象与原型的更新（）功能？

谢谢！

推荐答案

修改

这只是跳出我要添加TH元素，以一个THEAD。这不好！一个THEAD应该只包含TR的。 TR的可以包含TH的，但如果你使用THEAD我会用TD的来代替。

It just jumped out at me that you are adding "TH" elements to a "THEAD". This is bad! A THEAD should contain only TR's. TR's can contain TH's, but if you're using THEAD I would use TD's instead.

记住：TBODY，THEAD，TFOOT和表是细分的，而必须的包含TR元素。你不应该把TD或th元素直接到这些，因为结果充其量是联合国predictable。

Remember: tbody, thead, and tfoot are subdivisions of table, and must contain tr elements. You should not put td or th elements directly into these, as the results are unpredictable at best.

结束修改

这里的问题是，Element.update（）必须通过一个字符串，HTML代码段，或实现的toString的JavaScript对象（如元素）。然而，当你使用它，并将该对象的名字连在一起，你看到元素不支持+操作​​符。你将不得不显式调用每个孩子这样的toString方法：

The problem here is that Element.update() has to be passed a string, HTML snippet, or a javascript object that implements toString (e.g. Element). However, Element does not support the '+' operator as you are using it, and adds together the object names as you see. You would have to explicitly call the toString method on each child as such:

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

如果您正在使用您的应用程序script.aculo.us（原型扩展名），则可以使用生成器类，以协助更容易元建设。它提供了一个更直观的界面，创造大量元素时尤其如此。下面是一个例子：

If you are using script.aculo.us in your app (a Prototype extension), you can use the Builder class to assist in easier Element construction. It provides a much more intuitive interface, especially when creating large numbers of Elements. Here is an example:

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了解详情。

这篇关于原型Element.update多个对象的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！