2009-03-02 7 views
1

Каков наилучший простой javascript способ вставки X строк в таблицу в IE.Вставить строки в таблицу

таблица HTML выглядит следующим образом:

<table><tbody id='tb'><tr><td>1</td><td>2</td></tr></tbody></table> 

Что мне нужно сделать, это удалить старое тело, и вставить новый с 1000 строк. У меня 1000 строк в виде строковой переменной javascript.

Проблема в том, что таблица в IE не имеет функции innerHTML. Я видел много хаков, чтобы сделать это, но я хочу увидеть ваш лучший.

Примечание: использование jquery или любых других фреймворков не учитывается.

ответ

6

Вот большая статья парня, который реализован в IE innerHTML= на how he got IE to do tbody.innerHTML="<tr>...":

Сначала я думал, что IE не был способен выполнять перерисовки для измененных таблиц с innerHTML, но тогда я вспомнил, что я был ответственным за это ограничение!

Кстати трюк он использует в основном, как все рамки делают это для table/tbody элементов.

Редактировать: @mkoryak, ваш комментарий говорит мне, что у вас нулевое воображение и не заслуживает ответа. Но я все равно тебя буду юмором. Ваши очки:

> он не вставляя то, что мне нужно

ВАЗе? Он вставляет строки (которые он имеет как строку html) в элемент table.

> он также использует дополнительный скрытый элемент

Точка этого элемента должен был показать, что все IE нужно это «контекст». Вместо этого вы можете использовать элемент, созданный «на лету» (document.createElement('div')).

>, а также статья старая

Я никогда снова помочь вам;)

А если серьезно, если вы хотите увидеть, как другие реализовали его, посмотрите на исходный код JQuery для jQuery.clean(), или Prototype's Element._insertionTranslations.

+0

Хахаха, я только что прочитал это сегодня! Это хорошо читать. Ура для reddit. : D –

+0

Да, я читал, что сегодня тоже на самом деле. он не вставляет то, что мне нужно, он также использует дополнительный скрытый элемент, а также старую статью – mkoryak

+0

@crescentfresh yes: ive видел многие версии кода, которые делают то, о чем он говорит в моих путешествиях. я надеялся, что кто-то напишет какой-то код, а затем я мог бы посмотреть на него и сравнить его с другим кодом, чтобы узнать, что лучше. спрашивая людей, чтобы код всегда вызывает у меня проблемы: P – mkoryak

0

Сделайте это как jQuery, например. добавьте <table> и </table> вокруг него, вставьте в документ и переместите узлы, которые хотите, где вы хотите, и отпустите темп-элемент.

0

код заканчивал тем, что это:

if($.support.scriptEval){ 
    //browser needs to support evaluating scripts as they are inserted into document 
     var temp = document.createElement('div'); 
    temp.innerHTML = "<table><tbody id='"+bodyId +"'>"+html; 
    var tb = $body[0]; 
    tb.parentNode.replaceChild(temp.firstChild.firstChild, tb); 
    temp = null; 
    $body= $("#" + bodyId); 
    } else { 
    //this way manually evaluates each inserted script 
     $body.html(html); 
    } 

Вещи, которые Beed заранее существуют: таблица, которая имеет тело с идентификатором «bodyId». $ body - это глобальная переменная (или функция имеет замыкание на ней), и там есть немного jquery, потому что IE не анализирует сценарии, которые вставляются в html на лету.

0

У меня была такая же проблема (как и у многих других людей), и после многого разговора, вот что я получил, чтобы работать.

Вы должны сделать tr через document.createelement ('tr'), затем сделать td таким же образом. appendchild the td to tr, appendchild the tr to tbody (not table) THEN вы можете создать ваш тд, и он будет работать. Это было то, что я использовал. В основном структура таблицы должна быть сделана с помощью createelement, но остальная часть может быть innerHTMLed. Я делал это наблюдение в отладчике IE8, и он сказал бы, что добавит его (если бы я сделал tr.innerhtml = "blah") и не дал никакой ошибки, но он не отобразился, а html dom view показал очень сломанный table (нет td когда-либо, но the/td)

Итак, когда я сделал tr AND td по вызову createelement, он создал правильно выглядящий dom и правильно рисовал страницу.

 Смежные вопросы

  • Нет связанных вопросов^_^