作者:Gravitymann | 来源:互联网 | 2024-10-27 12:43
第11章详细探讨了DOM扩展,其中W3C将一些已经广泛采用的专有扩展标准化并纳入规范。本章重点介绍了两个主要的DOM扩展:SelectorsAPI(选择符API)和HTML5选择符API。这些扩展不仅增强了DOM操作的灵活性和效率,还为开发者提供了更强大的选择器支持,使得复杂的选择和操作变得更加简便。此外,本章还讨论了这些API在实际开发中的应用案例和最佳实践。
第11章 DOM扩展
W3C将一些已经成为事实标准的专有扩展标准化并写入规范当中。对DOM的两个主要扩展是SelectorsAPI(选择符API)和HTML5
选择符API
就是根据CSS选择符选择与某个模式匹配的DOM元素,SelectorsAPI是W3C发起制定的一个标准,致力于让浏览器原生支持CSS查询,极大改善了性能
Selectors API Level 1的核心是两个方法querySelector()和querySelectorAll()
querySelector()方法
它接收一个CSS选择符,返回与该模式匹配的第一个元素,如果没找到则返回null
var body=document.querySelector("body"); //取得body元素
var myDiv=document.querySelector("#myDiv"); //取得ID为"myDiv"的元素
通过Document类型调用querySelector()方法会在文档元素范围内查找匹配的元素,通过Element类型调用querySelector()方法只会在该元素后代元素范围内查找匹配的元素,如果传入了不被支持的选择符,querySelector()会抛出错误
querySelectorAll()
该方法与querySelector()类似,不过它返回的是带有所有属性和方法的NodeList对象,其底层是类似一组元素的快照,而非对文档进行搜索的动态查询,这样可以避免大多数性能问题
//取得某
中所有的
元素var ems=document.getElementById("myDiv").querySelectorAll("em");
方括号和item()方法取得NodeList里的某个元素
matchesSelector()方法
Selectors API Level
2规范为Element类型新增了matchesSelector()方法,这个方法接收一个参数,即css选择符,如果调用元素与该选择符匹配,返回true,否则返回false
if(document.body.matchesSelector("body.page1")){
//true
}
元素遍历
对于元素间的空格,IE9及之前版本不会返回文本节点,其他浏览器都会返回文本节点,这样导致使用childNodes和firstChild等属性时的行为不一致,Element
Traversal新定义了一组属性,只可以在IE9之后的版本使用......
HTML5
getElementsByClassName()方法
它接收一个参数即包含一个或者多个类名,返回带有指定类的所有元素的NodeList,传入多个类名时,类名的先后顺序不重要
var item1=document.getElementsByClassName("mydiv class1");
classList属性
Javascript高级程序设计27.pdf,布布扣,bubuko.com
推荐阅读
-
先上效果:主要实现了Listview的绑定和点击事件。项目资源结构如下:先创建一个动物类,用来装载数据:Animal类如下:packagecom.example.simplelis ...
[详细]
蜡笔小新 2024-12-20 18:17:25
-
本文介绍了如何通过Java代码计算一个整数的位数,并展示了多个基础编程示例,包括求和、平均分计算、条件判断等。 ...
[详细]
蜡笔小新 2024-12-20 23:46:25
-
-
本文详细介绍了ExtJS的功能及其在大型企业前端开发中的应用。通过实例和详细的文件结构解析,帮助初学者快速掌握ExtJS的核心概念,并提供实用技巧和最佳实践。 ...
[详细]
蜡笔小新 2024-12-21 15:41:04
-
本篇文章介绍如何将两个分别表示整数的链表进行相加,并生成一个新的链表。每个链表节点包含0到9的数值,如9-3-7和6-3相加得到1-0-0-0。通过反向处理链表、逐位相加并处理进位,最终再将结果链表反向,即可完成计算。 ...
[详细]
蜡笔小新 2024-12-20 20:40:05
-
本文详细介绍了如何为嵌入式应用开发搭建必要的软硬件环境,并提供了通过串口和网线两种方式将文件传输到开发板的具体步骤。适合Linux开发初学者参考。 ...
[详细]
蜡笔小新 2024-12-22 13:38:48
-
对于后端开发者而言,编写和维护API文档既繁琐又不可或缺。本文将介绍一款全新的API文档工具,帮助团队更高效地协作,简化API文档生成流程。 ...
[详细]
蜡笔小新 2024-12-22 11:02:41
-
本文探讨了不同地区和时间段的天气模式,通过详细的图表和数据分析,揭示了气候变化的趋势及其对环境和社会的影响。 ...
[详细]
蜡笔小新 2024-12-21 19:39:55
-
探讨 HDU 1536 题目,即 S-Nim 游戏的博弈策略。通过 SG 函数分析游戏胜负的关键,并介绍如何编程实现解决方案。 ...
[详细]
蜡笔小新 2024-12-21 18:26:33
-
在尝试使用C# Windows Forms客户端通过SignalR连接到ASP.NET服务器时,遇到了内部服务器错误(500)。本文将详细探讨问题的原因及解决方案。 ...
[详细]
蜡笔小新 2024-12-21 16:55:52
-
在设计模式中,动态代理模式是应用最为广泛的一种代理模式。它允许我们在运行时动态创建代理对象,并在调用方法时进行增强处理。本文将详细介绍动态代理的实现机制及其应用场景。 ...
[详细]
蜡笔小新 2024-12-21 15:46:52
-
通常情况下,修改my.cnf配置文件后需要重启MySQL服务才能使新参数生效。然而,通过特定命令可以在不重启服务的情况下实现配置的即时更新。本文将详细介绍如何在线调整MySQL配置,并验证其有效性。 ...
[详细]
蜡笔小新 2024-12-21 14:26:22
-
本文详细介绍如何在Python环境中安装和配置Selenium,包括开发工具PyCharm的安装、Python环境的设置以及Selenium包的安装方法。此外,还提供了编写和运行第一个自动化测试脚本的步骤。 ...
[详细]
蜡笔小新 2024-12-21 10:48:56
-
本文详细介绍如何在 iOS 7 环境下申请苹果开发者账号,涵盖从访问开发者网站到最终激活账号的完整流程。包括选择个人或企业账号类型、付款方式及注意事项等。 ...
[详细]
蜡笔小新 2024-12-21 10:20:50
-
本题要求在一组数中反复取出两个数相加,并将结果放回数组中,最终求出最小的总加法代价。这是一个经典的哈夫曼编码问题,利用贪心算法可以有效地解决。 ...
[详细]
蜡笔小新 2024-12-20 23:20:38
-
本文详细介绍了如何解决 Microsoft SQL Server 中用户 'sa' 登录失败的问题。错误代码为 18470,提示该帐户已被禁用。我们将通过 Windows 身份验证方式登录,并启用 'sa' 帐户以恢复其访问权限。 ...
[详细]
蜡笔小新 2024-12-20 18:41:13
-
Gravitymann
这个家伙很懒,什么也没留下!