没用过zencoding的同学可以自行研究,然后试试这段代码 :
h1{Snapshots}+ul>li*3>a[href="images/$.jpg" title="picture$" alt="picture$"]{picture$}
1 <html>
2 <head>
3 <meta charset=utf-8>
5 <title></title>
6 </head>
7 <body>
8 <h1>Snapshots</h1>
9 <ul>
10 <li><a href="images/1 (1).png" title="picture1" alt="picture1">picture1</a></li>
11 <li><a href="images/1 (2).png" title="picture2" alt="picture2">picture2</a></li>
12 <li><a href="images/1 (3).png" title="picture3" alt="picture3">picture3</a></li>
13 </ul>
14 <p>
15 childNodes 属性可以用来获取任何一个元素的所有子元素,它是一个数组.
16 noteType 属性总共有12种可用值,常用的3种
17 元素节点 noteType = 1 ,属性节点 noteType = 2 , 文本节点 noteType = 3.
18 如果想改变一个文本节点的值,就用nodeValue属性.
19 </p>
20 <img src="images/placeholder.png" alt="my image gallery" id="placeholder">
21 <p id="description">Choose an image</p>
22
23
24 <script>
25 links = document.getElementsByTagName("a");
26 for (var i = 0,j = links.length;i<j; i++) {
27 links[i].onclick = function(){
28 showPic(this);
29 return false;
30 }
31 }
32
33 function showPic(whichPic){
34 var source = whichPic.getAttribute("href");
35 var placeholder = document.getElementById("placeholder");
36 placeholder.setAttribute("src",source);
37
38 var text = whichPic.getAttribute("title");
39 var description = document.getElementById("description");
40 description.firstChild.nodeValue = text;
41 }
42 </script>
43 </body>
44
45 </html>