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>
相关文章推荐
- 强大的原生DOM选择器querySelector和querySelectorAll
- 原生的强大DOM选择器querySelector - querySelector和querySelectorAll
- 类似CSS选择器一样选择DOM——querySelector()&&querySelectorAll()
- DOM扩展:Selectors API(querySelector()和querySelectorALL())
- 强大的原生DOM选择器querySelector和querySelectorAll
- javascript基础(Dom查询的其他方法:body,documentElement,all,getElementsByClassName(),querySelectorAll())(二十八)
- javascript DOM扩展querySelector()和和querySelectorAll()
- IE6、IE7兼容querySelectorAll和querySelector方法-最终版本
- DOM元素querySelectorAll和querySelector
- DOM querySelector() 方法和querySelectorAll()方法区别。
- querySelector和querySelectorAll方法介绍
- 高级选择器querySelector和querySelectorAll
- javaScript中的querySelector()与querySelectorAll()的区别
- javascript之 原生document.querySelector和querySelectorAll方法
- javascript高级选择器querySelector和querySelectorAll
- HTML DOM querySelector()方法
- javascript高级选择器querySelector和querySelectorAll全面解析
- javascript的querySelectorAll()和querySelector()
- javascript高级选择器querySelector和querySelectorAll全面解析
- javascript高级选择器querySelector和querySelectorAll