Как добавить <table> с помощью элемента с прототипом в IE6?
Используя «новый элемент (...)» Prototype 1.6, я пытаюсь создать элемент <table> как с <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-код таблицы.
Как это сделать?
![Безумие обратных вызовов в javascript [JS]](https://i.imgur.com/WsjO6zJb.png)
Ответы 2
Если метод прототипов .update () внутренне пытается установить .innerHTML, он потерпит неудачу в IE. В IE .innerHTML элемента таблицы доступен только для чтения.
Источник:
http://webbugtrack.blogspot.com/2007/12/bug-210-no-innerhtml-support-on-tables.html
Как оказалось, в примере кода, который я предоставил в вопросе, нет ничего плохого - он отлично работает в 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. Дох!
Пусть это станет уроком для тех, кто не предоставляет свой код действительный!
в качестве альтернативы вы могли бы использовать className вместо class. prototypejs.org/2007/5/12/dom-builder#comment-15777