<html>
<head>
<style>
input{background：white;}
.active{background:yellow;}
div{width:550px;height:420px;display:none}
</style>
<script>
window.οnlοad=function(){
var tBn=document.getElementsByTagName("input");
var div=document.getElementsByTagName("div");
var i;
for(i=0;i<tBn.length;i++){
tBn[i].index=i;//为每个按钮都建立索引
tBn[i].οnclick=function(){//为每个按钮注册单击事件
for(i=0;i<tBn.length;i++){
tBn[i].className="";//js中凡是出现class的地方都用className代替
div[i].style.display="none";
}
this.className="active";//this代表当前发生事件的元素
div[this.index].style.display="block";
};
}
};
</script>
</head>
<body>
<input class="active" type="button" value="1"/>
<input type="button" value="2"/>
<input type="button" value="3"/>
<div style="display:block;"><img src="sharapova2.jpg"/></div>
<div><img src="sharapova3.jpg"/></div>
<div><img src="sharapova4.jpg"/></div>
</body>
</html>
效果图：
770
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
