重要的小问题：关于onmouseover和onmouseout的理解，和执行顺序

Question

重要的小问题：关于onmouseover和onmouseout的理解，和执行顺序

发布于
2017-07-29

更新于
2017-07-30

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>New Document</title>
<style>

ul{width:200px;}
ul li{color:#666;background:#eee;font-weight:bold;font-size:14px;height:30px;line-height:30px;padding:0 20px;list-style:none;}
ul .focus{font-size:22px;background:#555;color:white;}
ul .near{font-size:18px;background-color:#ccc;color:blue;}
ul .none{background:#333;color:white;}
ul .side{background:orange;}

</style>
</head>

<li class="none">frist row</li>
<li>111111</li>
<li>222</li>
<li>333</li>
<li>444</li>
<li>555</li>
<li>666</li>
<li>777</li>
<li class="none">888</li>

</ul>
</body>
<script>

var ul=document.getElementById("ul1");
 var li=ul.children;
var first=ul.firstElementChild;
var last=ul.lastElementChild;
for( var i=0 ;i<=li.length-1;i++){
    li[i].onmouseover=function(){
        if(this==first||this==last){
            this.className="side";
        }else{
            this.className="focus";
            this.previousElementSibling.className="near";
            this.nextElementSibling.className="near";    
            first.className="none";
            last.className="none";
        }
    };
    li[i].onmouseout=function(){--------》鼠标经过a之后，移动到b，在a的onmouseout的时候为什么不把移动到b时候呈现的onmouseover时的样式也一起清除呢？（只要一旦移入b的时候，就执行了b的onmouseover时样式，与此同时正好也就执行了a的onmouseout清除才对啊，这样以来就把所有的样式清除干净才对啊？）
        for ( var i=0;i<=li.length-1;i++){
            li[i].className='';
    }
    first.className="none";
    last.className="none";
}

}
</script>
</html>

javascript

阅读 1.8k

1 个回答

✓ 已被采纳

javascript 是不存在真正的同步的，一定必然绝对有先有后。
所以“与此同时正好也就执行了”这个说法是不通的。
那么问题就来了，ab 互邻不重叠，你说有没有可能先进入 b 再离开 a 的可能呢？
逻辑上来说，当然是离开家门比来到街上的顺序靠前啦。

撰写回答