js 訪問DOM物件

2021-06-27 21:13:37 字數 2090 閱讀 5847

document物件:

document物件實際上是window物件的屬性.所以,如下訪問是正確的:window.document.

document 有許多屬性:

常用的,可讀寫的:

document.title;改變頁面標題

document.url;載入新頁面

document集合:

document.anchors;所有:

document.embeds;所有:

document.forms;所有:

document.images;所有:

document.links;所有:

如:document.forms[0];或:document.form["linkform"];

處理特性:

每個節點的"屬性"訪問ie和dom不同,ie可以直接在物件後面跟屬性名稱訪問,如:obj.name;不管這個屬性是系統自帶的還是自定義的.但dom不同,如果是系統自帶的,dom也可以用上面方法訪問,但如果是自定義的,則必須用:obj.getattribute("someself");當然,ie也支援這個方法,所以,最好是用這個方法.而且,用obj.setattribute("someself","someval_rue");可以進行屬性的賦值.要想刪除乙個屬性,可以如下:obj.removeattribute("someself");新增屬性:obj.createattribute("someself");

訪問指定節點:

document.getelementbytagname("nodname");這是返回乙個陣列.就是所有節點名稱為指定名稱的節點.

document.getelementbyname("nameval_rue");返回乙個陣列.所有的"name"屬性值為指定值.

如:document.getelementbyidx("someid");返回乙個節點.因為在頁面中.id是唯一的.

得到乙個節點物件後,可以通過下面方法:

obj.childnodes;返回該元素的所有子節點.是個陣列;

obj.parentnode:返回該元素的父元素.因為父元素是唯一的,所以返回的是一單個物件.

obj.firstchild;第乙個子節點.

obj.lastchild:最後乙個子節點;

obj.nextsibling:後面的兄弟節點;

obj.previoussibling:前面的兄弟節點;

建立,操作節點;

createdocumentfragment();建立文件碎片,外面還有個文章是專門講文件碎片的.

createelement_x(tagname);建立節點

createtextnode(text);建立文字

在js中往頁面裡加html過程是這樣的:

先建立節點和文字,然後將文字新增到節點中.若還有上級節點,可繼續新增.然後再將節點新增到廣西中.如例:

var odiv = document.createelement_x("div");//建立乙個div節點

var op = document.createelement_x("p");//建立乙個p節點

var otext = document.createtextnode("something!")//建立文字

removechild(); //移除某元素裡的某個子節點;

replacechild() //替換子節點;

insertbefore() //在某節點前新增節點;

引用上面例子:

要將div裡面的節點刪除,可以這樣:odiv.removechild(op);

或:op.parentnode.removechild(op);//這樣可以在不知道它的父元素是誰的情況下刪除它,這種方法最好

要將op替換成新的內容:

var newp = document.createelement_x("p");

var newtext = document.createtextnode("new thing!")l

op.parentnode.replacechild(newp, op);

若不想用newp替換op,而是想讓它插在op前面:

op.parentnode.insertbefore(newp, op);

訪問DOM物件指定節點

一 介紹 使用getelementbyid 方法來訪問指定id的節點,並用nodename屬性 nodetype屬性和nodevalue屬性來顯示出該節點名稱 節點型別和節點值。1 nodename屬性 該屬性用來獲取某乙個節點的名稱。sname obj.nodename sname 字串變數用來儲...

訪問DOM物件指定節點

一 介紹 使用getelementbyid 方法來訪問指定id的節點,並用nodename屬性 nodetype屬性和nodevalue屬性來顯示出該節點名稱 節點型別和節點值。1 nodename屬性 該屬性用來獲取某乙個節點的名稱。sname obj.nodename sname 字串變數用來儲...

js文件物件模型DOM

1 textarea select input必須同時有id和name 2 每個節點都有兩個屬性 nodename和nodetype 但只有文字節點才會有nodue值 var p document.getelementbyidx x pnode 父節點 p.parentnode 子節點的陣列集合 p...