作家
登录

Javascript入门学习第六篇 js DOM编程第1/2页

作者: 来源:www.28hudong.com 2013-03-30 03:02:13 阅读 我要评论

学习英文: Dom:文档对象模型。Document object model Bom:浏览器对象模型。 注:也可以叫窗口对象模型。(window object model.) API:应用编程接口。 注:DOM其实可以看作一种API。 Node:节点。 注:节点分为:元素节点,属性节点,文本节点。 元素节点 包含 属性节点和文本节点。 Dom树: 下面我们直接看 到底怎么操作DOM。 1, 创建元素节点。createElement(): <SCRIPT LANGUAGE="JavaScript"> var a = document.createElement("p"); alert( "节点类型是 : " +a.nodeType + " , 节点名称是: " + a.nodeName); </SCRIPT> 输出 ; nodeType 是 1 . a.nodeName 是 p ; 所以它创建的是一个元素节点 ….你也许会想 为什么文档中没发现 节点 p呢? 我们看下面例子: <body> </body> <SCRIPT LANGUAGE="JavaScript"> var a = document.createElement("p"); document.body.appendChild(a); </SCRIPT> 用firebug查看下,发现文档中已经 有我们需要的结果了。 原来createElement()方法创建出来的新元素节点不会被自动添加到文档里,既然没添加到文档里,说明它还是一个游离的状态。如果想把它添加到文档里,可以使用 appendChild()或者insertBefore()方法或者replaceChild()方法(后面介绍)。 2,创建文本节点。createTextNode(): var b = document.createTextNode("my demo"); alert( "节点类型是 : " +b.nodeType + " , 节点名称是: " + b.nodeName); 输出 ; nodeType 是 3 . a.nodeName 是 #text ; 所以它创建的是一个文本节点 ….你也许又会想 为什么文档中没发现 这个文本节点 呢?难道也和createElement()一样,需要使用appendChild()添加到文档里。 对的,你的想法非常对。 我们看下面例子: <body> </body> <SCRIPT LANGUAGE="JavaScript"> var mes = document.createTextNode("hello world"); var container = document.createElement("p"); container.appendChild(mes);//先把文本节点添加到 元素节点 document.body.appendChild(container);//再把元素节点添加到 文档里 </SCRIPT> 3, 复制节点。cloneNode(boolean) :一个参数: 看一个例子: <body> </body> <SCRIPT LANGUAGE="JavaScript"> var mes = document.createTextNode("hello world"); var container = document.createElement("p"); container.appendChild(mes); document.body.appendChild(container); var newpara = container.cloneNode(true);//true和false的区别 document.body.appendChild(newpara ); var newpara = container.cloneNode(false);//true和false的区别 document.body.appendChild(newpara ); </SCRIPT> 看下firebug下的结果:

  推荐阅读

  SWFObject Flash js调用类

SWFObject是一个基于Javascript的Flash媒体版本检测与嵌入模块,其主要使用目的是让我们将FLASH嵌入网页中的操作更简单,加入了版本检测功能,符合XHTML的标准验证的插入,并解除了IE对FLASH点击激活的限制,对主>>>详细阅读


本文标题:Javascript入门学习第六篇 js DOM编程第1/2页

地址:http://www.17bianji.com/kaifa2/JS/29583.html

关键词: 探索发现

乐购科技部分新闻及文章转载自互联网,供读者交流和学习,若有涉及作者版权等问题请及时与我们联系,以便更正、删除或按规定办理。感谢所有提供资讯的网站,欢迎各类媒体与乐购科技进行文章共享合作。

网友点评
自媒体专栏

评论

热度

精彩导读
栏目ID=71的表不存在(操作类型=0)