码迷,mamicode.com
首页 > 编程语言 > 详细

JavaScript函数的调用(通过节点)--JavaScript DOM编程艺术

时间:2017-03-01 19:36:29      阅读:191      评论:0      收藏:0      [点我收藏+]

标签:函数   img   rip   rri   ret   asc   占位符   获取   问题:   

问题:点击某个图片链接时,可以在当前网页同时看到图片以及原有的图片清单

解决:增加一个“占位符”为图片预留一个浏览区域

1,在清单后添加占位符

<img id="placeholder" src="img/001.jpg" alt="my image">

2,改变占位符的src属性

function showPic(whichpic){var placeholder=document.getElementById("placeholder");//通过ID属性获取img元素的内容  

var source=whichpic.getAttrribute("src");//获取点击的图片链接的src属性的值

placeholder.setAttribute("src",source);//修改img元素的src属性为当前点击的图片链接

}

3,在图片清单在调用函数

<li><a href="img/001.jpg" onclick="showPic(this);return false;" title="">Rose</a></li>

说明:this表示这个<a>元素节点  、return false表示JS代码返回给onclick事件处理函数的值是false,会认为“这个链接没有被点击”,这样点击链接时就不会被带到另外一个图片查看器去。

JavaScript函数的调用(通过节点)--JavaScript DOM编程艺术

标签:函数   img   rip   rri   ret   asc   占位符   获取   问题:   

原文地址:http://www.cnblogs.com/monica123456/p/6485636.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!