Javascript学习笔记07——DOM

Node类型：

每个节点都有自己的父节点parentNode，包含在childNode中的节点都具有相同的父节点。同时都具有同胞节点。使用previousSibling和 nextSibliing可以访问所有的同胞节点。

列表中第一个节点的previousSibling节点为null，同理最后一个节点的nextSibling也为null。同样列表中只有一个节点，那么该节点的两个属性都为空。

父节点的fisrtchild和lastchild分别指向子节点列表中第一个和最后一个节点的指针。

使用hasChildNodes()方法判断是否有子节点。

例如div.hasChildNodes()//true

操作节点：

最常用的为appendChild（）方法，向childNode列表末尾中添加一个节点，返回新增的节点。

例如：var input=div.appendChild(inpNOde);

alert(input===inpNOde)//yes

alert(div.lastNode==input)//yes

如果希望把节点插入到父节点的某个位置，就使用insertBefore方法，该方法使用两个参数，一个是插入的节点，一个是参照的节点。

例如var div=divs.insertBefore(newNode,null);//插入成为最后一个节点。

alert(div===divs.lastChild).//true

也可以插入成为第一个节点：

var div=divs.insertBefore(newNode,divs.firstchild)

alert(div==divs.firstChild)//true

还可以替换节点，replaceChild()

var returnnode=divs.replaceChild(newnode,divs.firstnode).

Document类型：

document主要对文档进行一些操作。

获取文档标题var title=document.title;

var url=document.url

var domain=document.domain;

在查询元素方面，document提供了两个方法，一个是getElementById(),一个是getElementByTagName().

getElementById()接受参数为元素的id，如果元素存在就返回元素，如果不存在就返回null。如果页面中有多个元素的id相同，就只返回第一个元素。

var mydiv=document.getElementById("mydiv");

getElementByTagName()通过元素的标签来获得元素

例如var imgs=document.getElementByTagName("img");//获得image元素，返回的是HTMCOLLECTION类型.

特殊集合：

有些document属性可以直接获取元素，而不用专门的方法和参数获取。

document.forms功能与document.getElementTagName("form")

document.images==document.getElementTagName("image")

Element类型：

该类型提供了对元素属性的一些访问。

例如元素的nodename属性和tagname属性：

var div=document.getElementById("mydiv");

div.tagname==div.nodename;

alert(div.id)

alert(div.name)

alert(div.title)

alert(div.classname)

在element类型中有三个属性可以使用，来用来设置获得移除属性。

getAttribute(),

setAttribute()

removeAttribute()

使用方法：

var div=document.getElementById("mydiv");

alert(div.getAttribute("classname"));

在设置属性的时候，使用setAttribute()方法，参数分别为要设置的属性，和属性的新值。

创建元素：

var div=document.createElement("div");

div.id="mydiv";

DOM脚本动态加载：

向页面中添加js的方式一种是使用src来包含js文件，一种是通过元素本身来包含代码。

var script=document.createelement("script");

script.type="text/javascript";

script.text="function say(){alert("fuck")}";

//或者以下代码

script.appendchild(document.createTextNode("function say(){alert()}"));

document.body.appendchild(script);