Обновить html-файл с помощью javascript (без lib): возможно? - PullRequest
Новая
       11

Обновить html-файл с помощью javascript (без lib): возможно?

2 голосов
/ 04 мая 2011

Я хочу обновить содержимое TBODY (не весь TABLE, потому что в нем гораздо больше полуметаданных (LOL)). Я получаю> = 0 TR с сервера (XHR), и я хочу сбросить их в существующей таблице. Новые TR должны перезаписывать существующее содержимое TBODY.

Я сделал очень простой статический пример для jsFiddle , который работает в Chrome и, вероятно, во всех остальных случаях, кроме IE (я использую только Chrome и тестирую в IE8).

В Chrome работает самая первая попытка: сбросить TR в TBODY. Нет проблем!
В IE это не ... Я включил неработающий пример того, что я имел в виду, чтобы заставить его работать.

Я уверен, что эта проблема не нова: как мне вставить строку с TR в существующий TBODY?

PS. У jQuery нет проблем с этим !? Это используется здесь на SO. jQuery что-то делает с HTML, а затем вставляет его как узлы HTML ..? Или что-то? Я не могу прочитать эту сумасшедшую книгу. Это происходит в этом файле (ищите "html: function(". Вот где начинается магия.

У кого-нибудь есть функция или идея, чтобы это работало без библиотеки JS ?

Ответы [ 2 ]

0 голосов
/ 04 мая 2011

Здесь - хороший ресурс о проблемах innerHTML и IE.

Суть в том, что для tbody свойство innerHTML доступно только для чтения.

Вот решение, представленное в одном из комментариев: 

var innerHTML = "<tr><td>Hello world!</td></tr>";
var div = document.createElement("DIV");
div.innerHTML = "<table>" + innerHTML + "</table>";
// Get the tr from the table in the div
var trElem = div.getElementsByTagName("TR")[0];

Относительно jQuery части вопроса: 

//inside the html() function:
// If using innerHTML throws an exception, use the fallback method
} catch(e) {
  this.empty().append( value );
}

//inside the empty() function (basically removes all child nodes of the td):
while ( elem.firstChild ) {
  elem.removeChild( elem.firstChild );
}

//append calls domManip applying this to all table rows:
if ( this.nodeType === 1 ) {
  this.appendChild( elem );
}

//domManip as far as I can tell creates a fragment if possible and calls the three lines above with this=each row in turn, elem=the tbody(created if missing)
0 голосов
/ 04 мая 2011

Используя простой JavaScript, вы можете установить свойство innerHTML соответствующего элемента. Заданный вами текст может содержать смесь HTML и текста. Он будет проанализирован и добавлен в DOM.

...