1. 文件物件
節點分為元素節點、屬性節點、文字節點。
window.onload = function () {
var box = document.getelementbyid("box"); //通過id查詢元素節點，dom等待
alert(box.id); //元素id值
alert(box.tagname); //元素名
alert(box.innerhtml); //元素內部html片段
alert(box.classname); //元素css類名
alert(box.style); //元素style物件
2. 通過getelementsbytagname獲取元素集合
var box = document.getelementsbytagname('li'); //返回htmlcollection物件
box.length //返回元素集合長度
box[0] or box.item[0] //訪問第乙個元素
var all = document.getelementsbytagname("*"); //*代表所有元素
3. 通過getelementsbyname獲取元素集合
var box = document.getelementsbyname("test"); //ie瀏覽器在非法name屬性情況下，返回undefined.
4. 屬性操作
var box = document.getelementbyid("box");
title = box.getattribute("id"); //獲取id屬性，可以使用這個介面獲取自定義屬性
box.getattribute("class") //非ie瀏覽器獲取class
box.getattribute("classname") //ie瀏覽器獲取class
box.setattribute("classname", "good"); //有則更新屬性，沒有則建立屬性
box.setattribute("style", "color:red;") //ie瀏覽器7一下不支援設定style和onclick.
box.removeattribute("title"); //ie6及以下不支援
5. 屬性節點
var box = document.getelementbyid("box");
box.nodetype //1表示元素節點，2表示屬性節點，3表示文字節點
box.nodename //等價於box.tagname
box.nodevalue //表示屬性value值
6. 層次節點屬性
var box = document.getelementbyid("box");
box.childnodes //所有子節點
//文字節點內容使用nodevalue獲取，文字節點nodename為#text, nodevalue賦值不可以包含html標籤, innerhtml可以包含
box.firstchild //獲取第乙個子節點
box.lastchild //獲取最後乙個節點
box.ownerdocument //返回根物件
box.parentnode //父節點
box.previoussibling //同級前乙個節點
box.nextsibling //同級下乙個節點
box.attributes //返回屬性集合
box.attributes[0] or box.attributes['title'] //可以通過下標訪問，也可以通過屬性名訪問
box.childnodes //非ie瀏覽器包含空白節點，ie不包含
7.節點操作
var ele = document.createelement("p"); //建立元素節點
var box = document.getelementbyid("box");
var text = document.createtextnode('test div4'); //建立文字節點
box.parentnode.insertbefore(ele, box); //插入ele到box前面
document.createelement(""); //ie低版本使用這種方式建立radio元素節點
var span = document.getelementsbytagname("span")[0];
var em = document.createelement("em");
span.parentnode.replacechild(em, span); //使用em替換span元素
var box = document.getelementbyid("box");
var clone = box.firstchild.clonenode(true); //true轉殖文字節點，false只轉殖標籤
var box = document.getelementbyid("box");
box.removechild(box.firstchild); //刪除節點
8. 節點型別
node.element_node //元素節點,但是ie不支援node物件
node.text_node //文字節點
9. document型別
//document表示文件節點或根節點
document.nodetype //節點型別為9
document.nodename //節點標籤名字為document
document.documentelement //獲取html元素節點
document.body //獲取body元素節點
document.doctype; //獲取文件宣告節點, ie理解為comment節點, 非ie理解為documenttype節點
document.title; //代表文件title
document.url; //當前路徑
document.domain; //當前網域名稱
document.referrer; //前乙個路徑
10. text節點型別
var text1 = document.createtextnode("text1");
var text2 = document.createtextnode("text2");
box.normalize(); //合併同一級別的文字節點
box.childnodes[0].deletedata(0, 3); //刪除0到3的字元
box.childnodes[0].insertdata(0, "hello "); //插入字元
box.childnodes[0].replacedata(0, 2, 'hello'); //替換0到2的字元
11. dom擴充套件
//如果不寫，進入怪異模式
document.compatmode; //呈現模式
document.getelementbyid('box').scrollintoview(); //使元素box滾動到可見
var box = document.getelementbyid("box");
box.children; //與box.childnodes對比忽略空白節點
p = box.firstchild;
box.contains(p); //判斷p是否為box子節點，火狐低版本不支援
box.comparedocumentposition(p); //判斷p和box之間的關係，火狐和chrome支援
12. dom操作內容
var box = document.getelementbyid("box");
box.innerttext; //包含文字，去掉html標籤，火狐不支援, 火狐使用textcontent
innerhtmltext; //script片段是不能賦值的。
DOM 文件物件模型
dom 文件物件模型 概念的推出,這個api使html如虎添翼,但是有些學dhtml的朋友還是有些困撓,只是因為目前的手冊的書寫不太科學,是按字母 來分的,不便查閱.其實dom中最關鍵是要掌握節點與節點之間的關係 between node andnode 想學習dhtml中的dom千萬不要從頭到尾地...
DOM文件物件模型
dom document object model文件物件模型 用來將標記型文件的文件封裝成物件，並且將文件中的所有的類容 文字，屬性，屬性值 分裝成為物件。封裝的目的是為了更好的對文字文件進行操作。有了物件就可以更好的利用文件對其中的屬性和值進行呼叫。document 標記型文件 object 封...
DOM文件物件模型
文件 標記型文件 html xml 物件 封裝了屬性和行為 模型 共性特徵的體現 dom解析html 1 通過dom的方法，把html全部 元素 標籤 文字 屬性 都封裝成了物件 2 dom想要操作標記型文件先解析 解析器 dom解析html 瀏覽器也可以解析html dom的三個級別 1 將htm...