Не удается получить доступ к дочернему узлу в HTML

Я работаю над упражнениями, которые имеют дело с узлами. Я должен заменить первый дочерний элемент строки и второго элемента. Первый ребенок, меняющий «это» на «очень», но изменение «особого» на «обычное», похоже, не работает. Кто-нибудь объяснит мне это?Не удается получить доступ к дочернему узлу в HTML

<html> 
<head> 
<title>Page Title</title> 
<style> 
.red { color : #FF0000 } 
.big { font-size: xx-large } 
</style> 
<script type='text/javascript'> 
function f(){ 
    node=document.getElementById('i1'); 
    node.firstChild.nodeValue='Very '; 
    node.childNodes[1].nodeValue=" ordinary "; 
} 
</script> 
</head> 
<body class='big'> 
<h5>Making changes</h5> 
<p id='i1'>This is <em>special</em> <span class='red'>text</span>.</p> 
<p onclick='f();'>Click to change the paragraph</p> 
</body> 
</html>

источник

2016-11-30 Pete

Вы пытаетесь установить nodeValue в качестве HTMLElement. You cannot do this as the nodeValue for an HTMLElement (your em element) is null.

Вместо этого вам необходимо установить textContent, innerText, или innerHTML.

node.childNodes[1].textContent = " ordinary ";

Почему эта работа для node «s firstChild (изменение "Это" в "Очень")? Это textNode, поэтому вы можете установить и установить его nodeValue.

источник

2016-11-30 17:29:38 ajm

Спасибо, тщательное и краткое объяснение! – Pete

Здесь вы вызываете chillNodes [1], так что это второй элемент в списке chillNodes. Чтобы получить первого ребенка, вы должны позвонить chillNodes[0].

http://www.w3schools.com/jsref/prop_node_childnodes.asp

источник

2016-11-30 17:22:09 chab42

childNodes [0] вызывает «это», и к нему уже обращается firstChild. – Pete

Улыбка, ты совершенно прав. Вы пытались использовать .textContent вместо .nodeValue? – chab42

Вы должны сделать:

<html> 
<head> 
<title>Page Title</title> 
<style> 
.red { color : #FF0000 } 
.big { font-size: xx-large } 
</style> 
<script type='text/javascript'> 
function f(){ 
    node=document.getElementById('i1'); 
    node.firstChild.nodeValue='Very '; 
    node.childNodes[1].childNodes[0].nodeValue=" ordinary "; 
} 
</script> 
</head>

Поскольку <em> еще один ребенок. (https://jsfiddle.net/h8vmf0d6/)

источник

2016-11-30 17:30:28

Не удается получить доступ к дочернему узлу в HTML

ответ

Смежные вопросы