问题遇到的现象和发生背景
- JS中通过getElementsByTagName和getElementsByClassName不能够获取到子节点,这是为什么啊
问题相关代码,请勿粘贴截图
2、
<body>
<ul id="father">
<li>1</li>
<li>2</li>
<li>3</li>
</ul>
<ul class="father2">
<li>4</li>
<li>5</li>
<li>6</li>
</ul>
<script>
//获取父节点
let ul = document.getElementsByTagName('ul');
//获取所有子节点
// let son = document.body.childNodes;
let son = ul.childNodes;
console.log(son);//undifined
console.log(son.length);
//------------------------------------------
let ul2 = document.getElementsByClassName('father2');
console.log(ul2.childNodes.length);
//控制台报错
//Uncaught TypeError: Cannot read properties of undefined (reading 'length')
console.log(ul2.childNodes);
</script>
我的解答思路和尝试过的方法
3、而当我通过getElementById的方式就可以得到
//获取父节点
let ul = document.getElementById('father');
//获取所有子节点
// let son = document.body.childNodes;
let son = ul.childNodes;
console.log(son);
console.log(son.length);