каков первый дочерний узел этого элемента div? - PullRequest
Новая
       35

каков первый дочерний узел этого элемента div?

1 голос
/ 01 мая 2019

Каков первый дочерний узел элемента 'div' в этом примере?

Я думал, что это будет первый элемент 'p'.Кажется, что-то еще. 

<!DOCTYPE html>
<html>
<body>

<div id="myDiv">
<p>my first paragraph</p>
<p>my second paragraph</p>
</div>

<p id="demo1"></p>
<p id="demo2"></p>


<script>
document.getElementById("demo1").innerHTML = document.getElementById("myDiv").childNodes[0];

document.getElementById("demo2").innerHTML = document.getElementById("myDiv").childNodes[1].childNodes[0].nodeValue;


</script>

</body>
</html>


my first paragraph

my second paragraph

[object Text]

my first paragraph

1 Ответ

1 голос
/ 01 мая 2019

Поскольку в начале родительского элемента есть пробелы, это textNode с пробелами в качестве содержимого. Вы можете проверить свойство nodeType (3 представляет текстовый узел ) для проверки типа узла. 

console.log(document.getElementById("myDiv").childNodes[0].nodeType)
<div id="myDiv">
  <p>my first paragraph</p>
  <p>my second paragraph</p>
</div>

Чтобы получить только дочерние элементы, используйте children свойство. 

document.getElementById("myDiv").children[0].textContent;


console.log(document.getElementById("myDiv").children[0].textContent)
<div id="myDiv">
  <p>my first paragraph</p>
  <p>my second paragraph</p>
</div>
...