Как мне добавить элемент <table> using с Prototype в IE6?[закрыто]

Question

Используя Prototype 1.6 "новый элемент (...)", я пытаюсь создать <table> элемент с обоими a <thead> и <tbody> , но в 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>');

Возникает ошибка из-за того, что "класс" является зарезервированным словом в JavaScript.Дох!

Пусть это послужит уроком для тех, кто не поставляет свои фактический код!

Answer 2

Если метод prototypes .update() внутренне попытается установить .innerHTML, это приведет к сбою в IE.В IE, .innerHTML элемента таблицы доступен только для чтения.

Источник:

http://webbugtrack.blogspot.com/2007/12/bug-210-no-innerhtml-support-on-tables.html