11.入門第十一課:DOM--夢開始的地方（故事版）

javascript是一個英雄，但總要有戰場，它的戰場是“其所處的網頁內”。

瀏覽器載入完網頁後，會在記憶體中產生一個"document對象"，這個對象代表著整個網頁。即javascript的戰場就是"document"，有了它javascript就可以隨心所欲，為所欲為了。

利用它可以做什麼......?

1、可以啟用網頁內任何一個標記(tag)，把它們變成對象，並擷取或者改變其它們的資訊。代碼如下：

var xx=document.getElementById("xxx");//一個Element對象var yy=document.getElementsByTagName("xxx");//因為tagName可能在網頁內相同，所以yy一個NodeList對象，象數組。可以使用yy.item(index)的方式訪問var txt=xx.innerHTML;//讀取標記內的文本xx.innerHTML="設定的標記內的文本";xx.value="如果標記是表單元素，設定輸入的值";var t=xx.getAttribute("href");//直接擷取href屬性的值xx.setAttribute("href","屬性值");

2、刪除網頁內的標記

var xx=document.getElementById("xx");//先擷取他的父元素，再利用父元素將自己刪除沒有辦法，自己總不能刪除自己吧！）xx.parentNode.removeChild(xx);

3、創造游離對象，並添加到網頁中重要）：

var img=document.createElement("img");//創造一個元素對象游離）img.setAttribute("src","head.jpg");//對元素設定 src屬性var myLink=document.createElement("a");//又創造一個元素對象游離）myLink.setAttribute("href","t.jsp");//對元素設定 href屬性myLink.appendChild(img);//添加子節點//目前mylink中含有img,但都是游離狀態var rs=document.getElementById("rs");//啟用一個tag成為對象rs.appendChild(myLink);//添加游離對象到rs中，相當於在網頁展現

有個document對象，我們的javascript就可以遊走於頁面當中，操作javascript是我們自己，我們就是neo,document就是矩陣，let'sgo!!!

本文出自 “餘不漁” 部落格，請務必保留此出處http://johnyu.blog.51cto.com/7838287/1301886