logo

Alternativa pro innerHTML?

EDIT:WOW. Tato otázka je již 12 let stará.

Jak někdo uvedl, od roku 2016 to lze provést s jednou vložkou:https://stackoverflow.com/a/69322509/80907

Originál:

Zajímalo by mě, jestli existuje způsob, jak změnit text čehokoli v HTML bez použití innerHTML.

Důvod, proč se ptám, je ten, že to W3C tak trochu odsuzuje. Vím, že je to hnidopišství, ale chci jen vědět, existuje nějaký způsob?

EDIT:Zdá se, že lidé špatně pochopili, na co se zde ptám:Chci najít způsob, jak efektivně změnit zobrazovaný text.

Pokud mám:

<div id="one">One</a>

innerHTML mi to umožňuje:

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

A text na mé obrazovce se změní.
Nechci přidávat další text, přeji si změnit již existující text.

Odpověď

Doporučeným způsobem je manipulace s DOM, ale může to být docela upovídané. Například:

// <p>Hello, <b>World</b>!</p>
var para = document.createElement('p');
para.appendChild(document.createTextNode('Hello, '));

// <b>
var b = document.createElement('b');
b.appendChild(document.createTextNode('World');
para.appendChild(b);

para.appendChild(document.createTextNode('!'));

// Do something with the para element, add it to the document, etc.

UPRAVIT

V reakci na vaši úpravu, chcete-li nahradit aktuální obsah, jednoduše odstraníte stávající obsah a poté pomocí výše uvedeného kódu vyplníte nový obsah. Například:

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

Ale jak řekl někdo jiný, doporučil bych místo toho použít něco jako jQuery, protože ne všechny prohlížeče plně podporují DOM a ty, které mají zvláštnosti, které interně řeší knihovny JavaScriptu. Například jQuery vypadá nějak takto:

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

No