dom是針對html和xml文件的乙個api(應用程式程式設計介面)，它秒回的是乙個層次化的節點樹，允許開發人新增，移除，和修改某一部分。
1.document型別可以表示html頁面或基於xml的文件，不過最常見的還是作為htmldocument例項的document物件。
//所有瀏覽器都支援 document.documentelement和document.body
var html =document.documentelement;
alert(html === document.childnodes[0]);
var body=document.body;
/*
ie8和之前版本為null,ie9+和firefox如果存在文件型別宣告，則將起作為味道的第乙個子節點，
safari,chrome和opera如果存在文件型別則將其解析，但不作為文件的子節點
*/ var doctype=document.doctype;
console.log(doctype);
/* 獲取文件標題 */
var title=document.title;
console.log(title)
/* url屬性中包含頁面完整的url
domain屬性中只包含頁面的網域名稱
referrer屬性中則儲存這鏈結到當前頁面的那個頁面的url
*/ var url =document.url;
var domain=document.domain;
var referrer=document.referrer;
console.log('url'+url);
console.log('domain'+domain);
console.log('referrer'+referrer);
123
4
/*
getelementbyid:
取得div元素的引用,ie7以及更早版本為null。
但是ie7以及低版本中，當name特效和id都是box的時候，會返回input元素。
所以寫表單的name屬性的時候盡量別和其他id相同*/
var odiv=document.getelementbyid("box");
console.log(odiv);
/* getelementsbytagname,接受乙個引數(元素的標籤名),
返回乙個htmlcollection物件
屬性和方法：
length屬性獲取元素的數量
item()方法訪問物件中的項
nameditem()通過元素的name特性取得集合中的項
【可以簡化為，方括號傳入數值或字串形式的所有值之後，會自動呼叫item和nameditem方法】
*/ var odiv1=document.getelementsbytagname("div");
console.log(odiv1.length);//5
console.log(odiv1.item(1));//1
console.log(odiv1.nameditem('name11'));//1
console.log(odiv1[1]);//1
/* 其他少用的
getelementsbyname()返回帶有給的name特性的所有元素
document.anchors，所有帶name特性的元素
document.images，所有的
*/ /*
文件寫入
write(),writeln()寫入到輸出流中的文字
open()和close()分布用於開啟和關閉網頁的輸出流
*/ document.write(""+(new date()).tostring()+"")
element型別用於表現xml或html元素，提供對元素標籤名、子節點及特性的訪問。
2.元素屬性
/*
訪問元素的標籤名，可以用nodename也可以用tagname
*/ var odiv=document.getelementbyid("box");
console.log(odiv.tagname);//div
console.log(odiv.tagname ==odiv.nodename)//true
//用於判斷是否這個元素【使用任何文件】
if(odiv.tagname.tolowercase() == "div")
/* 獲取類-classname,title,lang等等*/
console.log(odiv.classname);
console.log(odiv.title);
console.log(odiv.lang);
/* 因為元素特性太多，乙個個獲取太麻煩，雖有又出來三個新方法方便獲取
getattribute(),setattribute(),removeattribute()
*/ console.log(odiv.getattribute("id"));
console.log(odiv.getattribute("class"));
odiv.setattribute("title","edittitle")
console.log(odiv.getattribute("title"));
/* 建立元素 */
var pe=document.createelement("p");
var odiv=document.createelement("div");
/* 建立文字節點*/
var textnode=document.createtextnode("hello world!");
var othertext=document.createtextnode("petter here");
/*把元素新增到文件樹
insertbefote()
replacechild()
*/ console.log(pe.childnodes.length);//2
//normalize()將文字節點合併成乙個節點
pe.normalize();
console.log(pe.childnodes.length);//2
/* 刪除元素 */
document.body.removechild(odiv)
DOM的增刪改
節點的新增 public static voidcreateelement document doc throwsexception 刪除節點 public static voiddeleteelement document doc throwsexception 修改節點及屬性 public st...
dom增刪改查
一 建立節點 document.createelement tag tag必須是合法的 html 元素二 dom新增 刪除節點的方法 將newnode新增成當前節點的最後乙個子節點 insertbefore newnode,refnode 將refnode 節點之前插入 newnode 節點repl...
DOM的增刪改查
1 建立li元素 var li document.createelement li 2 建立文字節點 var guangzhou document.createtextnode 廣州 3 將li元素與文字繫結在一起 li.guangzhou 4 獲取id為city的節點 var city docum...