У текстовых узлов нет атрибутов style
. Если вы хотите использовать childNodes
, убедитесь, что сначала nodeType
- 1 (узел Element
):
function myFunction() {
var divv = document.getElementById("divv");
var myCollection = divv.childNodes;
var len = myCollection.length;
var i;
for (i = 0; i < len; i++) {
if (myCollection[i].nodeType === 1) myCollection[i].style.color = "red";
}
}
<div id="divv">
<h2>JavaScript HTML DOM</h2>
<p>Hello World!</p>
<p>Hello Norway!</p>
<p>Click the button to change the color of all p elements.</p>
<button onclick="myFunction()">Try it</button>
</div>
Но я предпочел бы использовать querySelectorAll
и forEach
здесь:
function myFunction() {
document.querySelectorAll('#divv > *')
.forEach(child => child.style.color = "red");
}
<div id="divv">
<h2>JavaScript HTML DOM</h2>
<p>Hello World!</p>
<p>Hello Norway!</p>
<p>Click the button to change the color of all p elements.</p>
<button onclick="myFunction()">Try it</button>
</div>
(или, вы могли бы просто установите #divv
's style.color
на красный)
Нет, нет ничего особенного в метке, которую вы используете для реализации подпрограммы, она волшебным образом не охраняет код, который следует за ней. Ваша ветка здесь будет вести себя одинаково независимо от кодов условий.
С точки зрения процессора, здесь нет функций или подпрограмм, только последовательность инструкций с (произвольными) ветвями. Исключения разные, они немного различаются (но вы все равно можете использовать один и тот же диапазон адресов команд для исключения и в обычном коде, даже если это будет немного странно)