DOM2级核心 和 DOM2级视图 以及 DOM2级HTML 的变化
DcoumentType
新增方法
文档声明中的信息
publicId
systemId
internalSubset
Document类型的变化
importNode() 文档中取得一个节点,然后倒入到另一个文档,使其成为这个文档的一部分。
DOM2级核心:
document.implementation对象 新增
createDcoumentType() 创建一个新的节点,只在创建一个新的文档类型是有用
createDocument() 创建新文档
DOM2级HTML:
document.implementation
createHTMLDocument() 用于创建一个完整的HTML文档
DOM2级视图:
defaultView属性,保存着一个指针,指向拥有给定文档的窗口
Node类型的变化
isSupported()方法 用于确定当前节点具有什么能力
特性名和版本号
DOM3级,元素比较方法:
相等:两个节点是相同的类型,具有相等的属性
相同:两个节点引用的是同一个对象。
isSameNode()
isEqualNode()
DOM3级: 为DOM添加格外数据的新方法
getUserData()
setUserData()
框架的变化
框架 HTMLFrameElement
内嵌框架 HTMLIFrameElement
新的属性:contextDocument指向框架内容的文档对象。
DOM2级样式
访问元素的样式–style对象
- style对象是CSSStyleDeclaration的实例
- 对于使用段划线的CSS属性名,必须将其转换为驼峰式,才能通过JavaScript访问。
- float是javascript的保留字,所有不能用在属性名,将其转换成cssFloat,sytleFloat(IE)
- 标准模式下,所有度量值都必须指定一个度量单位。
DOM2级支持的样式
cssText style特征中css代码
length css属性的个数
parentRule CSS信息的CSSRule对象
getPropertyCSSValue(propertyName) 返回包含给定属性的CSSValue对象
getPropertyPriority(propertyName) 返回是否使用了!important
getPropertyValue(propertyName) 返回给定属性的字符串值
item(inexe) 返回给定位置的CSS属性名称
removeProperty(propretyName) 从样式中删除给定属性
setProperty(propertyName,value,priority):将给定属性设置为相应的值。计算样式
document.defaultView
方法
getComputedStyle()方法 返回CSSStyleDeclaration对象
所有计算样式都是只读的。不能修改计算后样式对象中的CSS属性。
操作样式表—CSSStyleSheet类型
包含通过<link>
元素包含的样式表和<style>
元素中定义的样式表。
这个两个元素分别由HTMLLinkElement和HTMLStyleElement类型表示。
CSSStyleSheet类型更为通用,CSSStyleSheet是一套只读接口,有一个属性除外。
CSSStyleSheet继承自StyleSheet(一个基础接口来定义非CSS样式表)
其StyleSheet的属性:
disabled:表示样式是否被禁用
href
media
ownerNode
parentStyleSheet
title
type
除了disabled,其它样式都是只读的。
CSSStyleSheet特有的:
cssRules
ownerRule
deleteRule(index)
insertRule(rule,index)
应用于文档的所有样式表都是通过document.styleSheets集合来表示的。
CSS规则
cssText
parentRule
parentSytleSheet
style
type
创建规则
isertRule()
addRule()(IE)
删除规则
deleteRule()
removeRule()(IE)
DOM2级遍历
偏移量
- offsetHeight 元素在垂直方法上占用的空间大小
- offsetWidth 元素在水平方法上占用的空间大小
- offsetLeft 元素的左外边距包含至左内边框之间的像素距离
- offsetTop 元素的右外边距包含至上内边框之间的像素距离
- offsetParent
客户区大小
元素内容及其内边距所占据的空间大小。
clientWidth 元素内容区宽度加左右内边距宽度
clientHeight 元素内容区高度加上上下内边距宽度
滚动大小
包含滚动内容的元素的大小。
scrollHeight
scrollWidth
scrollLeft
scrollTop
NodeIterator
TreeWalker
对于给定的起点对DOM结构执行深度优先的遍历操作。
NodeIterator
- 使用document.createNodeIterator()方法创建实例
参数:
root
whatToShow
filter
entityReferExpansion
whatToShow掩码位
NodeFilter是一个抽象类型,不能直接创建其实例
NodeFilter中的类型定义
- NodeFilter.SHOW_ALL
- NodeFilter.SHOW_ELEMENT
- NodeFilter.SHOW_ATTRIBUTE
- NodeFilter.SHOW_CDATA_SECTION
- NodeFilter.SHOW_ENTITY_REFERENCE
- NodeFilter.SHOW_ENTITY
- NodeFilter.SHOW_PROCESSING_INSTRAUCTION
- NodeFilter.SHOW_COMMENT
- NodeFilter.SHOW_DOCUMENT
- NodeFilter.SHOW_DOCUMENT_TYPE
- NodeFilter.SHOW_DOCUMENT_FRAGMENT
- NodeFilter.SHOW_NOTATOIN
NodeFilter中的方法
acceptNode()
过滤器的返回值:
- NodeFilter.FILTER_ACCEPT 应该访问给定的节点
- NodeFilter.FILTER_SKIP 不应该访问给定的节点
NodeIterator方法 - nextNode()
- previousNode()
TreeWalker
更高级版本
创建 document.createTreeWalker()
除了nextNode()和previousNode()外,提供的方法
parentNode()
firstChild()
lastChild()
nextSibling()
previousSibling()
过滤器的返回值:
NodeFilter.FILTER_ACCEPT 应该访问给定的节点
NodeFilter.FILTER_SKIP 跳过给定的节点继续前进到子树中的下一个节点。
NodeFilter.FILTER_REJECT 跳过相应的节点以及该节点的整个子树。
属性:
currentNode任何遍历方法在上一次遍历中返回的节点。可以修改遍历继续进行的起点
DOM2级范围
范围可以选择文档中的一个区域,而不必考虑节点的界限。
document.createRange()
属性提供了当前范围在文档中的位置
- startContainer
- startOffset
- endContainer
- commonAncestorContainer
方法
selectNode()
selectNodeContents()