当前位置: 代码迷 >> JavaScript >> 惯用基础js求教.
  详细解决方案

惯用基础js求教.

热度:29   发布时间:2012-08-26 16:48:05.0
常用基础js求教..
HTML code
<style>
<style>
a{ width:100px; height:100px; background:#CCC;}
.bb{ width:100px; height:100px; background:#666}
</style>
<div><a href="#">2</a><a href="#">3</a><a href="#">5</a></div>

点击2,给2附加样式aa,其他都不变,
点击3,给3附加样式aa,其它回复默认样式.



------解决方案--------------------
HTML code
<style>
<style>
a{ width:100px; height:100px; background:#CCC;}
.bb{ width:100px; height:100px; background:#666}
</style>
<div id="dv"><a href="#">2</a><a href="#">3</a><a href="#">5</a></div>
<script type="text/javascript">
    window.onload = function () {
        var as = document.getElementById('dv').getElementsByTagName('a');
        for (var i = 0, j = as.length; i < j; i++)
            //as[i].onclick = function () {//修改事件就好了
            as[i].onmouseover = function () {
                for (var i = 0, j = as.length; i < j; i++) as[i].className = '';
                this.className = 'bb';
            }
    }
</script> 
  相关解决方案