html>
网络相册图一
图二
图三
//获取全部相册链接
var a = document.getElementsByTagName('a');
//循环赋予点击事件
for(var i=0;i
a[i].onclick = function () {
// alert('123');
//获取当前a标签的href属性
var h = this.getAttribute('href');
//获取当前a标签title属性
var str = this.getAttribute('title');
//获取图片站位元素
var img = document.getElementsByTagName('img')[0];
//获取文字站位元素
var p = document.getElementsByTagName('p')[0];
//改变文字站位内容
p.innerHTML = str;
//给图片站位元素设置属性
img.setAttribute('src',h);
//禁用a标签自带跳转属性
return false;
}
}
原理:当点击链接时,替换站位元素属性。达到网络相册目的
步骤:1.通过循环给所有a标签赋予点击事件
2.通过 this.getAttribute("属性"),获取属性值
3.通过 this.setAttribute("被替换属性名",代替属性)
attribute 属性 attribute attribute