这周一直忙着工作上的事情,所以就开始的两天看了点~至于为啥从第五章直接跳到第十章,因为大佬看了我的进度,建议我先看第十章。。。。
IE中的所有DOM对象都是以COM对象的形式实现的。这意味着IE中的DOM对象与原生JavaScript对象的行为或活动特点并不一致
Node类型
Node.ELEMENT_NODE(1);
Node.ATTRIBUTE_NODE(2);
Node.TEXT_NODE(3);
Node.CDATA_SECTION_NODE(4);
Node.ENITY_REFERENCE_NODE(5);
Node.ENTITY_NODE(6);
Node.PROCESSING_INSTRUCTION_NODE(7);
Node.COMMENT_NODE(8);
Node.DOCUMENT_NODE(9);
Node.DOCUMENT_TYPE_NODE(10);
Node.DOCUMENT_FRAGMENT_NODE(11);
Node.NOTATION_NODE(12);
操作节点
下述四个必须先取得父节点
appendChild(),用于向childNodes列表的末尾添加一个节点。如果传入到appendChild()中的节点已是文档的一部分,将把该节点从原来的位置转移到新位置
insertBefore(),接受两个参数:要插入的节点和作为参照的节点。插入节点后,被插入的节点会变成参照节点的前一个同胞节点(previousSibling),同时被方法返回。如果参照节点为null,则等同于appendChild()
replaceChild(),接受两个参数:要插入的节点和要替换的节点
removeChild(),接受一个参数:要移除的节点。被移除的节点将成为方法的返回值
所有类型节点皆可
cloneNode(),用于创建调用这个方法的节点的一个完全相同的副本。接受一个布尔值参数,表示是否执行深复制。true,复制节点及其整个子节点树;false,只复制节点本身。复制后返回的节点属于文档所有,但是没有指定父节点。不会复制添加到DOM节点中的JavaScript属性(IE会,建议在复制前先移除事件处理程序)
如果已经将元素的引用保存在变量myList中
normalize(),用于处理文档树中的文本节点。由于解析器的实现或DOM操作等原因,可能会出现文本节点不包含文本,或者接连出现两个文本节点的情况。当在某个节点上调用这个方法时,就会在该节点的后代节点中查找上述两种情况。如果找到了空文本节点,则删除它;如果找到相邻的文本节点,则将它们合并为一个文本节点
Document类型
在浏览器中,document对象是HTMLDocument(继承自Document类型)的一个实例,表示整个HTML页面
document对象是window对象的一个属性,可以作为全局对象来访问
nodeName的值为”#document”
nodeValue的值为null
parentNode的值为null
ownerDocument的值为null
其子节点可能是一个DocumentType(最多一个)、Element(最多一个)、ProcessingInstruction或Comment
访问子节点
documentElement,指向元素
childNodes
body,指向元素
doctype,取得对的引用
关于浏览器对document.doctype的支持
IE8及之前版本:如果存在文档类型声明,会将其错误地解释为一个注释并把它当作Comment节点。而document.doctype的值始终为null
IE9+及Firefox:如果存在文档类型声明,则将其作为文档的第一个子节点:document.doctype是一个DocumentType节点,也可以通过document.firstChild或document.childNodes[0]访问同一个节点
Safari、Chrome和Opera:如果存在文档类型声明,则将其解析,但不作为文档的子节点。document.doctype是一个DocumentType节点,但该节点不会出现在document.childNodes中。
文档信息
title属性
URL
只有domain是可以设置的,但只能设置成子域名所含的域。如果域名一开始是loose,那么不能再设置为tight。即将document.domain设置为pearapple.net之后,就不能再将其设置回p2p.pearapple.net。
由于跨域安全限制,来自不同子域的页面无法通过JavaScript通信。而通过将每个页面的document.domain设置为相同的值,这些页面就可以互相访问对方包含的JavaScript对象了。
假设有一个页面加载自 www.pearapple.net,其中包含一个内嵌框架,框架内的页面加载自 p2p.pearapple.net。由于document.domain字符串不一样,内外两个页面之间无法相互访问对象的JavaScript对象。如果将这两个页面的document.domain值都设置为”pearapple.net”,它们之间就可以通信了。
查找元素
getElementById():找到返回该元素,不存在则返回null。除了IE8及较低版本,其他浏览器皆严格区分大小写。当页面中多个元素的ID值相同,只返回文档中第一次出现的元素
在IE7及较低版本,name特性与给定ID匹配的表单元素也会被该方法返回。建议不让表单字段的name特性与其他元素的ID相同
getElementsByTagName():接受要取得元素的标签名,返回包含零或多个元素的NodeList。在HTML文档中,返回一个HTMLCollection对象。要想取得文档中的所有元素,可以向getElementsByTagName()中传入”*”。标签名不需要区分大小写,但对于XML和XHTML页面区分大小写
getElementsByName():返回带有给定name特性的所有元素。一般用于取得单选按钮
特殊集合
都是HTMLCollection对象
document.anchors:包含文档中所有带name特性的元素
document.forms:包含文档中所有的元素
document.images:包含文档中所有的元素
document.links:包含文档中所有带href特性的元素
DOM一致性检测
hasFeature():接受要检测的DOM功能的名称及版本号
文档写入
在页面被加载的过程中,可以使用这两个方法向页面中动态地加入内容。注意不能直接包含字符串,应转换为
write():接受一个字符串参数,原样写入
writeln():接受一个字符串参数,末尾添加一个换行符
如果在文档加载结束后再调用,那么输出的内容将会重写整个页面。
open()和close()用于打开和关闭网页的输出流。如果是在页面加载期间使用write()或writeln()方法,则不需要用到这两个方法
Element类型
在HTML中,标签名始终都以全部大写表示;而在XML(有时候也包括XHTML)中,标签名则始终会与源代码中的保持一致
取得特性
getAttribute():传递的特性名与实际的特性名相同。如果给定名称的特性不存在,getAttribute()返回null。可以取得自定义特性的值,根据HTML5规范,自定义特性应该加上data-前缀以便验证。特性的名称不区分大小写。
在通过getAttribute()访问时,返回的style特性值中包含的是CSS文本,而通过属性来访问它则会返回一个对象。onclick()如果通过getAttribute()访问,则会返回相应代码的字符串。而在访问onclick属性时,则会返回一个Javascript函数(如果未在元素中指定相应特性,则返回null)
领取专属 10元无门槛券
私享最新 技术干货