Это быстрее, чтобы вставить встроенный HTML или создать новый элемент?

Question

У меня есть вопрос, я использую прототип, но, возможно, этот вопрос может быть применим и к нативному javascript.

Который, как правило, работает быстрее и эффективнее:

$(divElement).insert('<div>Hello</div');

или

$(divElement).insert(new Element(div).insert('Hello'));

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

var helloDiv = '<div>Hello</div>';
$(divElement).insert(helloDiv);

или

var helloDiv = new Element('div').insert('Hello');
$(divElement).insert(helloDiv);

Создает встроенный HTML быстрее, чемсоздать элемент, а затем вставить его?Эта информация может быть полезна, особенно для построения чего-то вроде таблиц.

Спасибо и благодарны за вашу помощь.

Answer 1

Это зависит от браузера, это определенно верно для ie и firefox, но кажется медленнее для chrome: http://jsperf.com/innerhtml-vs-createelement-test.

Answer 2

innerHTM L быстрее, чем appendChild

Преимущество appendChild состоит в том, что он действительно корректно обновляет DOM во всех браузерах, так что вы можете фактически читать назад и обновлять добавленные теги.

Использование innerHTML не обновляет DOM во всех браузерах, поэтому добавленное таким образом содержимое может не иметь возможности обновляться после добавления (если вам нужно это сделать).