本文實例講述了JavaScript實現LI列表數據綁定的方法。分享給大家供大家參考。具體如下：
利用JavaScript進行LI列表數據綁定，獲取列表里面對應的LI，這是一位高人寫的代碼，看了才知道，原來并不很復雜，為什么之前用的方法那么笨？
運行效果如下圖所示：
具體代碼如下：
<!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數據綁定</title></head><body><ul id="list"><li><a href="http://m.survivalescaperooms.com/article/70585.htm" target="_blank">JavaScript運動減速效果實例分析</a></li><li><a href="http://m.survivalescaperooms.com/article/70584.htm" target="_blank">JavaScript仿靜態分頁實現方法</a></li><li><a href="http://m.survivalescaperooms.com/article/70583.htm" target="_blank">JavaScript實現選擇框按比例拖拉縮放的方法</a></li><li><a href="http://m.survivalescaperooms.com/article/70582.htm" target="_blank">Javascript實現可旋轉的圓圈實例代碼</a></li><li><a href="http://m.survivalescaperooms.com/article/70581.htm" target="_blank">JavaScript數組各種常見用法實例分析</a></li></ul><script type="text/javascript"> var list_obj = document.getElementById("list").getElementsByTagName("li"); //獲取list所有li對象數組 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>希望本文所述對大家的javascript程序設計有所幫助。
新聞熱點
疑難解答
