如何在IE6中使用带有Prototype的Element添加<table>？

Question

使用Prototype 1.6的"new Element(...)"我试图用<thead>和<tbody>创建一个<table>元素,但在IE6中没有任何反应.

var tableProto = new Element('table').update('<thead><tr><th>Situation Task</th><th>Action</th><th>Result</th></tr></thead><tbody><tr><td>a</td><td>b</td><td>c</td></tr></tbody>');

我正在尝试像这样注入它的副本:

$$('div.question').each(function(o) {
  Element.insert(o, { after:$(tableProto.cloneNode(true)) });
});

我目前的解决方法是创建一个<div>而不是<table>元素,然后使用所有表格HTML"更新"它.

如何成功地做到这一点？

Answer 1

事实证明,我在问题中提供的示例代码没有任何问题 - 它在IE6中运行得很好.我面临的问题是我还错误地为构造函数中的<table>元素指定了一个类,但是从我的示例中省略了它.

"真实"代码如下,并且不正确:

var tableProto = new Element('table', { class:'hide-on-screen'} ).update('<thead><tr><th>Situation Task</th><th>Action</th><th>Result</th></tr></thead><tbody><tr><td>a</td><td>b</td><td>c</td></tr></tbody>');

这在Firefox中正常工作,但在IE6中失败,因为它是错误的.

通过此构造函数向元素添加属性的正确方法是提供字符串,而不仅仅是属性名称.以下代码适用于两种浏览器:

var tableProto = new Element('table', { 'class':'hide-on-screen'} ).update('<thead><tr><th>Situation Task</th><th>Action</th><th>Result</th></tr></thead><tbody><tr><td>a</td><td>b</td><td>c</td></tr></tbody>');

由于"class"是JavaScript中的保留字,因此存在错误.卫生署!

对于那些不提供实际代码的人来说,这是一个教训!