您的位置:首页 > 产品设计 > UI/UE

js--打卡--DOM的querySelector和querySelectorAll方法

2017-12-13 21:23 726 查看
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<script>

window.onload = function(){

/*
* document.querySelector(".box div")
*
* querySelector("");
*    --需要一个选择器的字符串作为参数,可以根据一个CSS的选择器来查询一个元素节点
*    --但是只会返回满足条件的第一个元素,不会再返回其他。
*
* querySelectorAll("")
*    --该方法会返回所有满足条件的元素节点,封装到一个数组中[object NodeList]
*      即使结果只有一个,也会返回一个数组。
*/
var div = document.querySelector(".box ");

console.log(div.innerHTML);

var div = document.querySelectorAll(".box ");
console.log(div);
console.log(div.length);  //[Web浏览器] "3"	/day14/03DOM的其他查询方法.html (26)

}

</script>
</head>
<body>
<div class="box">
我是box中的div
<div>我是box中的div </div>
</div>
<div class="box">
<div>我是box中的div </div>
</div>
<div class="box">
<div>我是box中的div </div>
</div>

<div>

</div>
</body>
</html>
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息