《JavaScript DOM 編程藝術(shù)》讀書(shū)筆記之JavaScript 圖片庫(kù)

更新時(shí)間：2015年01月09日 14:34:21 投稿：hebedich

這篇文章主要介紹了《JavaScript DOM 編程藝術(shù)》讀書(shū)筆記之JavaScript 圖片庫(kù),需要的朋友可以參考下

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

1，setAttribute方法是“第1級(jí)DOM”的組成部分，它可以設(shè)置元素節(jié)點(diǎn)的任意屬性。

2，element.src = source;這是在“第1級(jí)DOM”出現(xiàn)之前的方法，現(xiàn)在也有效。

“第1級(jí)DOM”的優(yōu)勢(shì)是可移植性好，那些老方法只適用于Web文檔，DOM則適用于任何一種標(biāo)記語(yǔ)言。

事件處理函數(shù)

當(dāng)點(diǎn)擊某個(gè)鏈接時(shí)，我希望留在這個(gè)網(wǎng)頁(yè)面而不是轉(zhuǎn)到另一個(gè)窗口，代碼如下：

復(fù)制代碼代碼如下:

<a href="

當(dāng)點(diǎn)擊這個(gè)鏈接時(shí)，因?yàn)閛nclick事件處理函數(shù)所觸發(fā)的Javascript代碼返回的值是false，所以這個(gè)鏈接的默認(rèn)行為沒(méi)有被觸發(fā).

childNodes屬性

childNodes屬性可以用來(lái)獲取任何一個(gè)元素的所有子元素。由childNodes屬性返回的數(shù)組包含所有類型的節(jié)點(diǎn)，而不僅僅是元素節(jié)點(diǎn)。事實(shí)上，文檔里幾乎每一樣?xùn)|西都是一個(gè)節(jié)點(diǎn)，甚至連空格和換行符都會(huì)被解釋為節(jié)點(diǎn)，而它們?nèi)及赾hildNodes屬性所返回的數(shù)組中。

但每個(gè)節(jié)點(diǎn)都有nodeType屬性。nodeType屬性總共有12種可取值，但其中僅有3種具有使用價(jià)值：元素節(jié)點(diǎn)的nodeType屬性值是1，屬性節(jié)點(diǎn)的nodeType屬性值是2，文本節(jié)點(diǎn)的nodeType屬性值是3.

如果想改變一個(gè)文本節(jié)點(diǎn)的值，那么就用DOM提供的nodeValue屬性。

數(shù)組元素childNodes[0]有個(gè)更直觀易讀的同義詞，可以把它寫成firstChild；DOM還提供了一個(gè)與之對(duì)應(yīng)的lastChild屬性。

示例：

復(fù)制代碼代碼如下:

<p id="description">Choose an image</p>

首先創(chuàng)建一個(gè)變量來(lái)存放它：

復(fù)制代碼代碼如下:

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

description.nodeValue的返回值是null。<p>元素本身的nodeValue屬性是一個(gè)空值，而如果想要得到<p>元素包含的文本的值，要用description.childNodes[0].nodeValue或者description.firstChild.nodeValue

您可能感興趣的文章: