JavaScript第四章:JavaScript

  把占位符上的图片替换成想要查看的图片,可以利用setAttribute改变它的src属性。

  我们要写一个函数,函数有一个参数及图片的链接。它可以通过改变占位符的src属性更换为参数图片。

  

function showPic(whichPic)
//whichPic为元素节点,在本例中就是指向某图片<a>元素

whichPic.getAttribute(“href”)
//分离出图片的文件路径

var source=whichPic.getAttribute("href");
//将图片的文件路径保存在变量source中

var placeholder=document.getElementById("placeholder")
//获取占位符图片

placeholder.setAttribute("src",source);
//通过setAttribute对placeholder元素的属性进行刷新

1.非DOM解决方案

     setAttribute方法是第一级DOM的组成部分,可以设置任何元素节点的属性值。

     下面我们将讨论不使用setAttribute来改变元素的属性。

      第一级DOM的优势:

                      可以修改任何元素节点的任何属性值

                      可移植性强,可适用于多种环境和多种程序设计语言的通用API

  element.value="the new value";
  element.setAttribute("value","the new value");
 //上面两个语句是等价的

  placeholder.src=source;

2.最终的函数代码清单

  function showPic(whichPic){
     var source=whichPic.getAttribute(""href");
     var placeholder=document.getElementById("placeholder");
     placeholder.setAttribute("src",source);
}

猜你喜欢

转载自blog.csdn.net/rachel9798/article/details/82767386