object超类的"三个子类"

来源：互联网发布：jisucopy是什么软件编辑：程序博客网时间：2024/06/10 23:47

背景介绍：IE8.0及其以下版本的浏览器会忽略节点间的空白节点（空格、回车和Tab键），遵循W3C规范的浏览器（Chrome、FireFox、Safari等）则会把这些空白作为文本节点处理。(测试浏览器版本均超过IE8.0)

<html><head><meta http-equiv="Content-Type" content="text/html;charset=UTF-8"><title>object超类的"三个子类"</title></head><body><div id="demo1">     <div>子节点11</div>     <div class="test">子节点12</div>     <div>子节点13</div></div><div id="demo2"><div>子节点21</div><div>子节点22</div><div>子节点23</div></div><button onclick="myFunction()">点我</button>     <script type="text/javascript">function myFunction() {/**此时注意，x是object HTMLCollection(Object) x[0]是object HTMLDivElement[因为x会被当成数组对象处理，而ById是唯一不会出现此类情况]*前者属于js对象，后者属于dom对象，但是二者同时可以执行element相关操作*/    var x = document.getElementsByClassName("test");    alert(x);}//此时是object textdocument.getElementById("demo1").onclick=function(){        alert(            "第一个子节点："+this.firstChild.innerHTML+"\n"+            "第一个子节点的类型是："+this.firstChild.nodeType+"\n"+            "第一个子节点的名称是："+this.firstChild.nodeName        );}//此时是object HTMLDivElementdocument.getElementById("demo2").onclick=function(){        alert(            "第一个子节点："+this.firstChild.innerHTML+"\n"+            "第一个子节点的类型是："+this.firstChild.nodeType+"\n"+            "第一个子节点的名称是："+this.firstChild.nodeName        );}</script></body></html>

0 0