javascript innerHTML без childNodes?

Question

им с вопроса FireFox, где я не вижу леса за деревьями с помощью Ajax, я получаю источник HTML с PHP скрипт

этот HTML код содержит тег и в TBODY некоторые более тр/ТД

теперь я хочу добавить этот обычный текст в существующую таблицу. но есть еще одно условие: таблица является частью формы и, следовательно, содержит checkboxe и drop down's. если бы я использовал table.innerHTML + = content; светлячок перезагружает таблицу и сбросить это все элементы в ней, которые Isnt очень дружелюбными, как ид нравится иметь

, что у меня есть эта

// content equals transport.responseText from ajax request 
function appendToTable(content){ 
    var wrapper = document.createElement('table'); 
    wrapper.innerHTML = content; 
    wrapper.setAttribute('id', 'wrappid'); 
    wrapper.style.display = 'none'; 
    document.body.appendChild(wrapper); 

    // get the parsed element - well it should be 
    wrapper = document.getElementById('wrappid'); 
    // the destination table 
    table = document.getElementById('tableid'); 

    // firebug prints a table element - seems right 
    console.log(wrapper); 
    // firebug prints the content ive inserted - seems right 
    console.log(wrapper.innerHTML); 

    var i = 0; 
    // childNodes is iterated 2 times, both are textnode's 
    // the second one seems to be a simple '\n' 
    for(i=0;i<wrapper.childNodes.length;i++){ 
     // firebug prints 'undefined' - wth!?? 
     console.log(wrapper.childNodes[i].innerHTML); 
     // firebug prints a textnode element - <TextNode textContent=" "> 
     console.log(wrapper.childNodes[i]); 
     table.appendChild(wrapper.childNodes[i]); 
    } 
    // WEIRD: firebug has no problems showing the 'wrappid' table and its contents in the html view - which seems there are the elements i want and not textelements 
} 

либо это настолько тривиально, что я не вижу проблемы или Сво и я надеюсь, что у кого-то здесь есть много опыта, чтобы дать совет по этому поводу - любой может себе представить, почему я получаю текстовые ноды, а не окончательно разобранные элементы dom, которых я ожидаю?

Кстати: кстати я не могу дать полный пример, потому что я не могу написать меньше неработающего кусок кода его один из тех ошибок, которые больше появляться в дикой природе, а не в моем testset

ТНХ все

Answer 1

Вероятно, вы столкнулись с причудой Firefox, следуя спецификации W3C. В спецификации пробелы между тегами являются «текстовыми» узлами, а не элементами. Эти TextNodes возвращаются в childNodes. This other answer описывает обходное решение. Также использование чего-то типа JQuery делает это намного проще.

Answer 2

Я ожидал бы такого поведения в любом браузере, так как операнд + = перезаписывает то, что уже есть в таблице по определению. Два решения:

Вместо того, чтобы получать HTML-код из вашего PHP-файла, создайте PHP для создания списка элементов для добавления в таблицу. Запятая/вкладка разделена, что угодно. Затем используйте Table.addRow(), Row.addCell() и cell.innerHTML, чтобы добавить элементы в таблицу. Так я предлагаю сделать это, нечего создавать элементы GUI в двух отдельных файлах.

Другое решение - сохранить все данные формы, которые уже были введены в локальные переменные JavaScript, добавить таблицу, а затем перезагрузить данные в поля формы.

Answer 3

Ну, возврат объекта JSON с новыми данными кажется лучшим вариантом. Затем вы можете синтезировать дополнительные элементы таблицы, используя это.

В случае, если вы вынуждены получить простой HTML в качестве ответа, можно использовать, например, var foo = document.createElement('div');, а затем сделать foo.innerHTML = responseText;. Это создает элемент, который не добавляется ни к чему, но содержит разобранный HTML-ответ.
Затем вы можете развернуть элемент foo, получить нужные элементы и добавить их в таблицу в удобном для DOM виде.

Edit:

Ну, я думаю, я вижу свою точку зрения в настоящее время.
wrapper - сам элемент таблицы. Узлы находятся под телом, ребенок wrapper, который является его lastChild (или вы можете получить к нему доступ через своего члена tBodies[0], в Firefox).
Затем, используя элемент tBody, я думаю, что вы сможете получить то, что хотите.

Кстати, Вам не нужно добавлять обертку к документу перед добавлением своих детей к столу, так что не нужно, чтобы скрыть это и т.д.