Próbowałem ustawić wewnętrzny tekst div z JavaScript z tekstem, w tym < lub >, ale nie działa. Jakieś pomysły?

Oto moja próbka kodu (prosta HTML z łatwym javascript) za pomocą akcji TEST-Click-Click.

<html>
<body>
<div id="aaa">
div
</div>

<hr>

<a onclick="getElementById('aaa').innerHTML = 'abc';">click ok1</a>
<p>
<a onclick="var str='asbc'; getElementById('aaa').innerHTML = str;">click ok2</a>
<p>
<a onclick="getElementById('aaa').innerHTML = '<uio>';">click nok1</a>
<p>
<a onclick="getElementById('aaa').innerHTML = '&lt;wer&gt;';">click nok2</a>
<p>
<a onclick="var str='<abc>'; getElementById('aaa').innerHTML = str;">click nok3</a>
<p>
<a onclick="var str='&lt;abc&gt;'; getElementById('aaa').innerHTML = str;">cl nok4</a>
<p>
<a onclick="alert ('&lt;wer&gt;');">click a</a>
<p>
<a onclick="alert ('<w34r>');">click b</a>
<p>

</body>
</html>

Praca w alertach, ale nie w ustawianiu innerHTML ... Bez < lub > jego działa też, więc musi być czymś z postaciami.

-2
chris01 6 grudzień 2013, 01:13

2 odpowiedzi

Najlepsza odpowiedź

Jeśli umieścisz rzeczywiste znaki "<" i ">" w ciągu, np. "<uio>", a następnie po ustawieniu tego jako innerHTML Przeglądarka traktuje go jako znacznik HTML, który nie Rozpoznawaj i nic nie jest wyświetlane.

Kiedy używasz podmiotów HTML, takich jak "&lt;abc&gt;" w języku JS, który jest wbudowany z twoim znacznikiem Przeglądarka pierwsza analizuje go jako HTML i wtedy traktuje go jako JS, więc to, z czym jest silnik JS, jest "<abc>".

Możesz obejść to, robiąc to w Inline {X0}} Prywatne elementy:

document.getElementById("aaa").innerHTML ='&amp;lt;abc&amp;gt;'

... Ponieważ w tym czasie silnik JS wstrzymuje go, będzie to "&lt;abc&gt;".

Możesz też przesunąć JS do elementu skryptu i możesz użyć "&lt;abc&gt;".

1
nnnnnn 5 grudzień 2013, 21:33

Nie używaj innerHTML, aby wstawić < i >. Użyj textContent:

getElementById('aaa').textContent = '<uio>'

2
punund 5 grudzień 2013, 21:37