網(wǎng)頁特效代碼模板無憂>網(wǎng)頁特效>綜合其它特效代碼>

JavaScript進(jìn)行LI列表數(shù)據(jù)綁定的方法_綜合其它特效

利用JavaScript進(jìn)行LI列表數(shù)據(jù)綁定，獲取列表里面對(duì)應(yīng)的LI，這是一位高人寫的代碼，看了才知道，原來并不很復(fù)雜，為什么之前用的方法那么笨？

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">       
<html xmlns="http://www.w3.org/1999/xhtml" >       
<head>       
<title>JS數(shù)據(jù)綁定</title>       
</head>       
<body>       
<ul id="list">       
<li><a href="/jscss/code/124.shtml" target="_blank">左右切換鼠標(biāo)可控的無縫圖片滾動(dòng)代碼</a></li><li><a href="/jscss/code/111.shtml" target="_blank">一款經(jīng)典簡(jiǎn)潔的CSS滑動(dòng)門代碼</a></li><li><a href="/jscss/code/47.shtml" target="_blank">豎向折疊的CSS滑動(dòng)菜單</a></li><li><a href="/jscss/code/194.shtml" target="_blank">QQ在線客服JS代碼，自適應(yīng)漂浮在網(wǎng)頁右側(cè)</a></li><li><a href="/jscss/code/255.shtml" target="_blank">JS圖片滾動(dòng)代碼（無縫、平滑）</a></li>       
</ul>       
<script type="text/javascript">           
    var list_obj = document.getElementById("list").getElementsByTagName("li"); //獲取list所有l(wèi)i對(duì)象數(shù)組        
    for (var i = 0; i <= list_obj.length; i++) {        
        list_obj[i].onmousemove = function() {        
            this.style.backgroundColor = "#cdcdcd";        
        }        
        list_obj[i].onmouseout = function() {        
            this.style.backgroundColor = "#FFFFFF";        
        }        
        list_obj[i].onclick = new function(n) {    
           return function(){alert("這是第" +(n+1)+"條");}    
        }(i);    
        
    }        
</script>       
</body>       
</html>

所屬頻道：綜合其它特效/更新時(shí)間：2013-04-27

[收藏][報(bào)錯(cuò)][返回列表]

相關(guān)綜合其它特效：

JavaScript進(jìn)行LI列表數(shù)據(jù)綁定的方法_綜合其它特效

綜合其它特效Rss訂閱特效代碼搜索

綜合其它特效推薦

猜你也喜歡看這些