Страница 1 из 1

интересный момент в Dom 4

Добавлено: 29 апр 2007, 14:51
WEB_bobby
Если попытаетесь добавить разметку в значение текстового узла, браузер обработает ее как обычный текст, вот пример:

Код: Выделить всё

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">

<html>
<head>
	<title>Untitled</title>
</head>

<body>
<p id="sample4">Вот <b>текст</b>, который будем изменять.</p>

<p>
<a href="" onclick="document.getElementById('sample4').firstChild.nodeValue = '<b>If something`s</b> hard to do...'; return false;">меняем раз</a>
::
<a href="" onclick="document.getElementById('sample4').firstChild.nodeValue = '...then it`s <i>not worth</i> doing!'; return false;">меняем еще</a>
</p> 

</body>
</html>
1.Есть ли способ добавить в текстовый узел теги именно как теги?
2. Интересно, что браузер и в дальнейшем, при обращении к nodeValue понимает
<b></b> как текст, а не как теги. Получается, что браузер где-то у себя делает
заметку что это не теги а текст?И притом только на момент выполнения программы. Интересно зачем надо было такие имхо дурацкие правила
создавать. Если уж ты хочешь тег текстом то для этого есть и другие способы(правда забыл как именно ;) - давно дело было - если не трудно напомните)

Re: интересный момент в Dom 4

Добавлено: 29 апр 2007, 19:24
Oscar
[HTML]<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">

<html>
<head>
<title>Untitled</title>
</head>

<body>
<p id="sample4">Вот <b>текст</b>, который будем изменять.</p>

<p>
<a href="" onclick="document.getElementById('sample4').innerHTML = '<b>If something`s</b> hard to do...';

return false;">меняем раз</a>
::
<a href="" onclick="document.getElementById('sample4').innerHTML = '...then it`s <i>not worth</i>

doing!'; return false;">меняем еще</a>
</p>

</body>
</html>[/HTML]

Re: интересный момент в Dom 4

Добавлено: 29 апр 2007, 20:07
WEB_bobby
Oscar писал(а):[HTML]<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">

<html>
<head>
<title>Untitled</title>
</head>

<body>
<p id="sample4">Вот <b>текст</b>, который будем изменять.</p>

<p>
<a href="" onclick="document.getElementById('sample4').innerHTML = '<b>If something`s</b> hard to do...';

return false;">меняем раз</a>
::
<a href="" onclick="document.getElementById('sample4').innerHTML = '...then it`s <i>not worth</i>

doing!'; return false;">меняем еще</a>
</p>

</body>
</html>[/HTML]
- А без innerHTML?

Re: интересный момент в Dom 4

Добавлено: 29 апр 2007, 21:52
Oscar
WEB_bobby,
а чем, интересно, innerHTML не нравится?

вот вариант без него, чистый DOM :

[HTML]<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">

<html>
<head>
<title>Untitled</title>
<script type="text/javascript">
function first() {
while(document.getElementById("sample4").firstChild) {
document.getElementById("sample4").removeChild(document.getElementById("sample4").firstChild);
}
var b = document.createElement("b");
var text = document.createTextNode("If somethins's");
b.appendChild(text);
document.getElementById("sample4").appendChild(b);
var text2 = document.createTextNode(" hard to do...");
document.getElementById("sample4").appendChild(text2);
}

function second() {
while(document.getElementById("sample4").firstChild) {
document.getElementById("sample4").removeChild(document.getElementById("sample4").firstChild);
}
var text = document.createTextNode("...then it's ");
document.getElementById("sample4").appendChild(text);
var i = document.createElement("i");
var text2 = document.createTextNode("not worth");
i.appendChild(text2);
document.getElementById("sample4").appendChild(i);
var text3 = document.createTextNode(" doing!");
document.getElementById("sample4").appendChild(text3);
}
</script>
</head>

<body>
<p id="sample4">Вот <b>текст</b>, который будем изменять.</p>
<p><a href="" onclick="first(); return false;">меняем раз</a> :: <a href="" onclick="second(); return false;">меняем еще</a></p>
</body>
</html>[/HTML]

Re: интересный момент в Dom 4

Добавлено: 30 апр 2007, 06:56
__Yuri__
А уж если быть совсем догматиками объектно(node)-ориентрованной парадигмы и идти в передовых рядах поборников концепции отделения смысловой информации от оформления, то следует применять SPAN и CSS.

Re: интересный момент в Dom 4

Добавлено: 30 апр 2007, 13:14
WEB_bobby
дом тоже надо понимать!