11. javacript高级程序设计-DOM扩展
1. DOM扩展
1.1 选择符API
l querySelector()
接收一个css选择符,返回与该模式匹配的第一个元素
l querySelectorAll()
接收一个css选择符,返回所有匹配的NodeList元素
1.2 HTML5
1.2.1 与类相关的扩充
l getElementsByClassName()
接收一个参数,一个包含一或者多个类名的字符串,返回带有指定类的所有元素的NodeList
l classList属性,add(value),contains(value),remove(value),toggle(value)
classList获取元素的所有类属性,并通过对应的方法操作对应的类
1.2.2 焦点管理
document.activeElement属性指向当前文档中获得焦点的元素
document.hasFocus()判断当前文档是否获取了焦点
1.2.3 HTMLDocument变化
l readyState属性:
loading:正在加载文档
complete:已经加载完文档
l 兼容模式
标准模式:document.compatMode == “CSS1Compat”
混杂模式:document.compatMode == “BackCompat”
l head属性
var head = document.head || document.getElementsByTagName(“head”)[0];
1.2.4 字符集属性
document.charset 表示当前文档中使用的字符集
1.2.5 自定义属性
HTML5可以为元素添加非标准属性,但要添加前缀data-
获取设置appId自定义属性
var appId = div.dataset.appId;
div.dataset.appId = 23456;
1.2.6 插入标记
l innerHtml:返回当前元素所有子节点对应的HTML标记
l outerHtml:返回当前元素以及对应的所有子元素的HTML标记
1.2.7 scrollIntoView
scrollIntoView()可以在所有的html元素上调用,通过滚动浏览器窗口或者每个容器元素,调用元素就可以出现在视口中。
- 10. javacript高级程序设计-DOM
- JS高级程序设计11-DOM扩展
- 13. javacript高级程序设计-事件
- 18. javacript高级程序设计-JavaScript与XML
- javascript高级程序设计第三版 第11章 DOM扩展
- 3. javacript高级程序设计-基本概念
- JavaScript高级程序设计之DOM 扩展之HTML5之自定义数据属性第11.3.5讲
- JavaScript高级程序设计之DOM 扩展之专有扩展之插入文本第11.4.4讲
- 20. javacript高级程序设计-JSON
- 22. javacript高级程序设计-高级技巧
- 23. javacript高级程序设计-数据存储
- JavaScript高级程序设计9--DOM扩展
- 4. javacript高级程序设计-变量、作用域和内存问题
- 15. javacript高级程序设计-Canvas绘图
- JavaScript高级程序设计之DOM 扩展之HTML5之焦点管理第11.3.2讲
- 17. javacript高级程序设计-错误处理与调试
- JavaScript高级程序设计之DOM 扩展之专有扩展之滚动第11.4.5讲
- 19. javacript高级程序设计-E4X
- JavaScript高级程序设计之DOM 扩展之HTML5之HTMLDocument的变化第11.3.3讲
- 21. javacript高级程序设计-Ajax与Comet