你的位置:首页 > 软件开发 > Java > 从原型链看DOM--Comment,CDATASection,DocumentType,DocumentFragment,Attr类型

从原型链看DOM--Comment,CDATASection,DocumentType,DocumentFragment,Attr类型

发布时间:2016-04-17 15:00:14
这次总结的是剩下的这些DOM类型节点,可能你见过却不经常使用但是了解一下总是好的,可以加深对DOM体系的整体理解~。本篇要介绍的是Comment,CDATASection,DocumentType,DocumentFragment,Attr类型。Comment类型原型链继承关系为 ...

从原型链看DOM--Comment,CDATASection,DocumentType,DocumentFragment,Attr类型

这次总结的是剩下的这些DOM类型节点,可能你见过却不经常使用但是了解一下总是好的,可以加深对DOM体系的整体理解~。本篇要介绍的是Comment,CDATASection,DocumentType,DocumentFragment,Attr类型。Comment类型

原型链继承关系为comment实例.__proto__->Comment.prototype->CharacterData.prototype->Node.prototype->EventTarget.prototype->Object.prototype。与Text节点类似,也可以通过nodeValue或data访问注释的内容。

var com=document.createComment('I am comment');com;// <!--I am comment-->com.data;// "I am comment"com.nodeValue;// "I am comment"
FF44.0.2:出现在HTML元素之前之后的注释节点都会处理。>IE9:出现在HTML元素之前之后的注释节点都会处理。<=IE9:只处理HTML元素之前的注释节点。 注意:IE8中注释节点和文档声明被当作标签名为"!"的元素,开启IE8仿真模式后,由于IE8不支持访问DOM中一些API原生对象,所以通过使用getElementsByTagName()(继承自Document.prototype)可以取得被当作元素节点的注释节点和文档声明节点。从原型链看DOM--Comment,CDATASection,DocumentType,DocumentFragment,Attr类型(2).当注释位于HTML元素内

<!DOCTYPE html><html><head> <title></title> <!-- I am comment--></head><body> <!-- I am comment too--></body></html>
即使将代码中a < b间的空格去掉变为a<b,也会提示出错“解析属性出错”,毕竟b后面跟的是“)”。避免出现这种情况的解决方式有两种:(2).用一个CDat**段来包含JS代码,因为在XHTML(
<script type="text/javascript"><![CDATA[  function compare(a, b){   if(a < b){     console.log("A is less than B");   }esle if(a > b){     console.log("A is greater than B");   }else{     console.log("A is equal to B");   }  }]]></script>
在兼容XHTML的浏览器中这个办法可行,但实际上还有不少浏览器不兼容XHTML因而不支持CDat**段。这种情况下使用JS注释将CData标记注释掉就可。

<script type="text/javascript">//<![[  function compare(a, b){   if(a < b){      }else if(a >b){   }else{   }  }//]]></script>
CDATASection节点具有下列特征:

  • nodeType值为4
  • nodeName值为"cdata-section"
  • nodeValue值是内容区域的内容
  • parentNode可能是Document或Element
  • 不支持子节点

(1).兼容性:CDATA区域只会出现在

(2).在真正

var cd=document.createCDATASection('mycdata');cd;// <![CDATA[mycdata]]>document.appendChild(cd);/*Uncaught DOMException: Failed to execute 'appendChild' on 'Node': 它具有下列特征: 

  • nodeType值为10
  • nodeName值为doctype名称,保存文档类型的名称即当前文档最外层标签顶级元素,document.doctype.name也可获取,就是出现在<!DOCTYPE 之后的文本(不包括后面那些PUBLIC...DTD版本号和文件路径)获取的为小写内容(不论之前代码中是否大小写)。这两种方式都是不可写的,因为nodeName和name的访问器属性set为undefiend。注意文档片段类型只支持getElementById获取元素,没有getElementsByTagName那系列的,不过可以通过querySelector获取,毕竟很万能~从原型链看DOM--Comment,CDATASection,DocumentType,DocumentFragment,Attr类型原型链继承关系为:attrNode.__proto__=>Attr.prototype=>Node.prototype=>EventTarget.prototype特性节点具有下列特征

    • nodeType值为2
    • nodename值是特性的名称
    • nodeValue值是特性的值
    • parentNode值为null
    • 在HTML中不支持子节点

    尽管特性节点也是节点,但却不认为是DOM文档树中的一部分。开发人员最常使用的是getAttribute(),setAttribute(),removeAttribute()很少直接引用特性节点(这些方法继承自Element.prototype)。(2).创建新的特性节点:document.createAttribute()从原型链看DOM--Comment,CDATASection,DocumentType,DocumentFragment,Attr类型参考

    JavaScript高级程序设计》


    原标题:从原型链看DOM--Comment,CDATASection,DocumentType,DocumentFragment,Attr类型

    关键词:dom

dom
*特别声明:以上内容来自于网络收集,著作权属原作者所有,如有侵权,请联系我们: admin#shaoqun.com (#换成@)。