為什么使用圖片庫
在網(wǎng)頁中沐旨，如果一張網(wǎng)頁加載太多的圖片奔滑，那么這張網(wǎng)頁將會顯示很慢荤堪，而且浪費用戶流量，而javasrcipt來創(chuàng)圖片庫將是最佳的選擇：把整個圖片庫的瀏覽鏈接集中安排在圖片庫主頁里沼填，只在用戶點擊了這個頁面里的某個圖片鏈接時才把相應(yīng)的圖片傳送給他桅咆。
方法
<html>
<head>
<script>
function showPic(whichPic){
var source=whichPic.getAttribute("href");
var placeholder=document.getElementById("placeholder");
placeholder.setAttribute("src",source);
}
</script>
</head>
<body>
<ul>
//return false的話超鏈接的默認行為則不起作用
<li ><a href="image/1.jpg" onclick="showPic(this);return false;">1.jpg</a></li>
<li ><a href="image/2.jpg" onclick="showPic(this);return false;">2.jpg</a></li>
<li ><a href="image/3.jpg" onclick="showPic(this);return false;">3.jpg</a></li>
<li ><a href="image/4.jpg" onclick="showPic(this);return false;">4.jpg</a></li>
<li ><a href="image/5.jpg" onclick="showPic(this);return false;">5.jpg</a></li>
<li ><a href="image/6.jpg" onclick="showPic(this);return false;">6.jpg</a></li>
<li ><a href="image/7.jpg" onclick="showPic(this);return false;">7.jpg</a></li>
<li ><a href="image/8.jpg" onclick="showPic(this);return false;">8.jpg</a></li>
<li ><a href="image/9.png" onclick="showPic(this);return false;">9.png</a></li>
<li ><a href="image/10.png" onclick="showPic(this);return false;">10.png</a></li>
</ul>
<image id="placeholder" src="image/11.jpg" alt="this is picture's placeholder">
</body>
</html>
childNodes屬性：
在一顆節(jié)點樹上沸柔，childNodes屬性可以用來獲取任何一個元素的所有子元素匾二，它是一個包含這個元素全部子元素的數(shù)組
nodeType
- 元素節(jié)點的nodeType的屬性值是1
- 屬性節(jié)點的nodeType的屬性值是2
- 文本節(jié)點的nodeType的屬性值是3
nodeValue屬性
如果想要改變一個文本節(jié)點的值就需要使用nodeValue屬性。但nodeValue屬性獲取description對象的值時举庶，得到的并不是包含在這個段落里的文本羞海。
用description.childNodes[0].nodeValue來獲取文本節(jié)點的值而不是用description.nodeVlue;其中childNodes[0]等價于firstChild;而lastChild就是這個子節(jié)點中最后一個元素
