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

Мне интересно, есть ли способ изменить текст всего в HTML без использования <div id = "one" > One </a> .

Причина, о которой я прошу, заключается в том, что W3C на нее нахмурился. Я знаю, что это ничто, но я просто хочу знать, есть ли способ?

EDIT: люди, похоже, неправильно понимают, что я прошу здесь: я хочу найти способ эффектно изменить отображаемый текст.

Если бы у меня был:

var text = document.getElementsById("one");
text.innerHTML = "Two";

// <p> Здравствуйте, <b> World </ b>! </ p> var para = document . createElement ( 'p' ); пункт . appendChild ( document . createTextNode ( 'Hello,' )); // <b> var b = document . createElement ( 'b' ); b . AppendChild ( документ . createTextNode ( 'Мир' ), пункт . AppendChild ( б ); пункт , appendChild ( document . createTextNode ( '!' )); // Делаем что-то с элементом para, добавляем его в документ и т. Д., Позволяет мне это сделать:

var someDiv = document.getElementById('someID');
var children = someDiv.childNodes;
for(var i = 0; i < children.length; i++)
    someDiv.removeChild(children[i]);

И текст на моем экране изменится.
Я не хочу добавлять больше текста, я хочу изменить весь существующий текст.

javascript,w3c,innerhtml,

32

Ответов: 11


33 ов принято

Рекомендуемый способ - с помощью 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,
Похожие вопросы