首頁 >web前端 >js教程 >《JavaScript DOM 程式設計藝術》閱讀筆記之JavaScript 圖片庫_javascript技巧

《JavaScript DOM 程式設計藝術》閱讀筆記之JavaScript 圖片庫_javascript技巧

WBOY
WBOY原創
2016-05-16 16:21:211040瀏覽

改變圖片的src屬性的兩種方式:

1,setAttribute方法是「第1級DOM」的組成部分,它可以設定元素節點的任意屬性。

2,element.src = source;這是在「第1級DOM」出現之前的方法,現在也有效。

「第1級DOM」的優點是可移植性好,那些老方法只適用於Web文檔,DOM則適用於任何一種標記語言。

事件處理函數

當點擊某個連結時,我希望留在這個網站頁面而不是轉到另一個窗口,程式碼如下:

複製程式碼 程式碼如下:

http://www.example.com" onclick="showPic(this); return false ;">Click

當點擊這個連結時,因為onclick事件處理函數所觸發的Javascript程式碼回傳的值是false,所以這個連結的預設行為沒有被觸發.

childNodes屬性

childNodes屬性可以用來取得任何一個元素的所有子元素。由childNodes屬性傳回的陣列包含所有類型的節點,而不僅僅是元素節點。事實上,文件裡幾乎每一樣東西都是一個節點,甚至連空格和換行符都會被解釋為節點,而它們全都包含在childNodes屬性所傳回的陣列中。

但每個節點都有nodeType屬性。 nodeType屬性總共有12種可取值,但其中只有3種具有使用價值:元素節點的nodeType屬性值是1,屬性節點的nodeType屬性值是2,文字節點的nodeType屬性值是3.

如果想改變一個文字節點的值,那就用DOM提供的nodeValue屬性。

陣列元素childNodes[0]有個更直觀易讀的同義詞,可以把它寫成firstChild;DOM也提供了一個與之對應的lastChild屬性。

範例:

複製程式碼 程式碼如下:

Choose an image


先建立一個變數來存放它:

複製程式碼 程式碼如下:

var description = document.getElementById("description");

description.nodeValue的回傳值是null。

元素本身的nodeValue屬性是空值,而如果想要得到

元素包含的文字的值,要用description.childNodes[0].nodeValue或是description.firstChild.nodeValue

陳述:
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn