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!!!



發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章