Альтернатива для innerHTML?

Альтернатива для innerHTML?

Ответов: 11


Рекомендуемый способ - с помощью DOM-манипуляции, но он может быть довольно многословным. Например:

$('#someID').html("<p>Hello, <b>World</b>!</p>");

РЕДАКТИРОВАТЬ

В ответ на ваше редактирование, чтобы заменить текущий контент, вы просто удаляете существующий контент, а затем используйте приведенный выше код, чтобы заполнить новый контент. Например:

document.createTextNode

Но, как сказал кто-то другой, я бы рекомендовал вместо этого использовать что-то вроде jQuery, поскольку не все браузеры полностью поддерживают DOM, а те, которые имеют причуды, которые обрабатываются внутри библиотеки JavaScript. Например, jQuery выглядит примерно так:

innerHTML

10

Лучший способ сделать это - использовать document.createTextNode. Одной из основных причин использования этой функции innerHTMLявляется то, что все экранирование HTML-символов будет позаботиться о вас, тогда как вы должны были бы избежать своей строки самостоятельно, если бы вы просто устанавливали innerHTML.


6

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

var node = document.getElementById("one");

while( node.firstChild )
    node.removeChild( node.firstChild );
node.appendChild( document.createTextNode("Two") );

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

Причина, по которой большинство разработчиков избегает использования innerHTML, заключается в том, что доступ к элементам через DOM соответствует стандартам.


6

Если вы хотите изменить обычный текст, то есть более быстрое решение, основанное на стандартах:

document.getElementById("one").firstChild.data = "two";

В любом случае, обратите внимание, что innerHTML будет частью нового стандарта HTML 5.


4

Просто.

Заменить text.innerHTML = 'two'с text.firstChild.nodeValue = 'two'.

JavaScript, w3c, innerhtml,
Похожие вопросы