关于JavaScript的学习（2）

 昨天完成了在同一网页上点击链接，显示图片且页面不发生跳转，今天尝试在同一网页上切换显示不同的文本。

<a href="image/timg.jpg" title="小僵尸" οnclick="showPic(this); return false">Fireworks</a>，每个图片链接都有一个title属性，目的：将title属性与链接的图片显示在同一页面。之前解决图片跳转问题是在本页面将“占位符”图片替换为链接的图片，那么文字节点的显示也可以用类似操作。先设置一个“占位符”段落，然后用获取的title属性的value替换“占位符”段落的text即可。

这里就涉及节点的属性操作了，childNodes属性：将文档的节点树里任何一个元素的所有子元素检索出来。用法：element.childNodes。 由于childNodes返回的是所有类型的节点（甚至包括空格节点），所以我们需要用nodeType属性来区分文档里的各个节点。用法：node.nodeType.注意nodeType返回的值：

而对于文本节点的值的修改，可以使用nodeValue属性：用来检索和设置节点的值。用法：node.nodeValue。“占位符”段落是这样的： <p id="description">Choose an image</p>，而要将<p>元素里的“Choose an image”替换为title的值，description.nodeValue无法获得<p>元素里的text节点的值，正确的应该是description.childNodes[0].nodeValue。注意：包含在<p>元素里的文本是另一种节点，他在DOM里的是<p>元素的第一个子节点，也即，要检索<p>元素的第一个子节点的nodeValue属性值。description.childNodes[0]即为第一个子节点的表示方法=description.firsChild。除此之外，还有lastChild属性，用法都是node.firstChild(lastChild)。最后将title的值赋给text即可：

var text=whichPic.getAttribute('title');

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

description.firstChild.nodeValue=text;