JavaScript学习-DOM扩展_选择符API
来源:互联网 发布:安卓用的java模拟器 编辑:程序博客网 时间:2024/05/16 08:49
JavaScript学习-DOM扩展-选择符API
1,介绍
- 根据CSS选择符查询DOM文档中某个模式匹配的元素。
2,Selectors API Level 1
- 核心是两个方法:querySelector()和querySelectorAll()。通过Document及Element类型的实例调用它们。
querySelector()
- 参数接收一个CSS选择符,返回与该模式匹配的第一个元素,若没找到,返回null。
- 通过Document类型调用在文档元素的范围内,通过Element类型调用,在该元素后代元素范围内查找。
- 如果传入了不支持的选择符,会抛出错误。
代码示例:
//取得body元素var body = document.querySelector("body");//取得ID为“myDiv”元素var myDov = document.querySelector("#myDiv");//取得类为“selected”的第一个元素var selected = document.querySelector(".selected");//取的类为“button"的第一个图像元素var img = document.body.querySelector("img.button");
querySelectorAll()
- 参数和返回值同querySelector()。
- 返回的是一个NodeList的实例。
- Document,DocumentFragment和Element可以调用querySelectorAll()方法。
代码示例
//取的某<div>中所有<em>元素var ems = document.getElementById("myDiv").querySelectorAll("em");//取的类为“selected”的所有元素var selecteds = document.querySelectorAll(".selected");//取的所有<p>元素中的所有<strong>元素var strongs = document.querySelectorAll("p strong");
3,Selectors API Level 2
matchesSelector()
- 参数同上
- 支持Element调用,如果调用元素与该选择符匹配,返回true,返回false。
代码示例
if (document.body.matchesSelector("body.page1")){//true}
0 0
- JavaScript学习-DOM扩展_选择符API
- 【JavaScript学习】DOM扩展:选择符API
- DOM扩展_选择符API
- JavaScript学习-DOM扩展_专有扩展
- JavaScript学习-DOM扩展_元素遍历
- JavaScript高级程序设计之DOM 扩展之选择符API第11.1讲
- JavaScript学习-DOM扩展_HTML5
- 《JS高程(3)》DOM扩展-API选择符-第11章笔记(18)
- JavaScript学习笔记之DOM扩展
- javascript学习——DOM扩展
- JavaScript Dom编程 学习书籍选择
- DOM 扩展 Selectors API
- JavaScript学习-操作样式的DOM API
- javascript DOM扩展
- JavaScript DOM 扩展
- JavaScript:DOM扩展
- javascript DOM扩展
- JavaScript DOM扩展
- 编写脚本 直接可以通过authconfig 认证ldap用户,并且开机自动
- Java 8种基本数据类型
- leetcode
- 2017-05-01
- 5.1JEE实习 downLoad 功能的实现
- JavaScript学习-DOM扩展_选择符API
- java线程安全总结
- 如何使用Xshell
- 语言学习留条法则
- HTML之9大标签思维导图总结二
- hibaernate连接sql server ** User ** 关键字附近有错误
- hdu 3974 Assign the task(区间建树)(区间更新+单点查询)
- Hibernate中级联的取值(cascade的取值)和孤儿删除
- CodeForces 801A Vicious Keyboard 模拟