JavaScript Dom编程艺术-C4 案例研究：JavaScript图片库

一、实例过程

1.写html页面 gallyery.html 

2.写js脚本( 路径scripts/showPic.js)

     （非DOM操作元素的属性 element.value = "the new value"）

3.调入相关js

     <script [type="text/javascript" ] src = "scripts/showPic.js"></script>

4.写函数处理事件

     event = "java statement(s)" //如 onclick="showPic(this)"

5.事件拦截

     在onclick后面加上return false；//也可以在js里加，但对函数有影响

     //如 onclick="showPic(this);return false;"

6.引入样式表

增加<link rel="stylesheet" href= "style/layout.css" media="screen">

(styles/layout.css)

二、其它DOM属性

     1.childNodes属性

     element.childNodes 返回改元素的所有子元素的对象数组

     window.onload("alert（'页面加载时运行的函数'）");

     2.nodeType(共12种)

     node.nodeType  返回一个数字 {"元素节点"：1，“属性节点”：2，“文本节点”：3}

     3.nodeValue

     node.nodeValue 返回元素所包含的值，而不是属性内的文本

     4.firstChidl和lastChild

     node.firstChild 返回节点第一个元素

     node.lastChild 返回节点的最后一个元素