欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

javascript操作ul中l(wèi)i的方法

 更新時(shí)間:2015年05月14日 09:47:52   作者:永遠(yuǎn)愛(ài)好寫(xiě)程序  
這篇文章主要介紹了javascript操作ul中l(wèi)i的方法,可實(shí)現(xiàn)鼠標(biāo)經(jīng)過(guò)li標(biāo)簽項(xiàng)對(duì)應(yīng)改變背景色的功能,涉及javascript鼠標(biāo)事件及頁(yè)面元素屬性的相關(guān)操作技巧,需要的朋友可以參考下

本文實(shí)例講述了javascript操作ul中l(wèi)i的方法。分享給大家供大家參考。具體如下:

<!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>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>動(dòng)態(tài)控制li球隊(duì)列表</title>
<script type="text/javascript">
function iniEvent() {
 var ul = document.getElementById("football");
 var lis = ul.getElementsByTagName("li");
 for (var i = 0; i < lis.length; i++) {
  //鼠標(biāo)經(jīng)過(guò)事件
  lis[i].onmouseover = function () {
   var ul = document.getElementById("football");
   var lis = ul.getElementsByTagName("li");
   for (var i = 0; i < lis.length; i++) {
    var li = lis[i];
    if (li == this) {
     li.style.background = "red";
    }
    else {
     li.style.background = "gray";
    }
   }
  }
  //鼠標(biāo)單擊事件
  lis[i].onclick = function () {
   var ul = document.getElementById("football");
   var lis = ul.getElementsByTagName("li");
   for (var i = 0; i < lis.length; i++) {
    var li = lis[i];
    if (li == this) {
     li.style.fontSize = 30;
    }
    else {
     li.style.fontSize = 16;
    }
   }
  }
 }
}
</script>
</head>
<body onload="iniEvent()">
<!--功能說(shuō)明
1.鼠標(biāo)滑過(guò)的行變?yōu)榧t色
2.點(diǎn)擊行字體變大
-->
<ul style="width:200px" id="football">
<li>皇馬</li>
<li>曼聯(lián)</li>
<li>切爾西</li>
<li>巴薩</li>
<li>Ac米蘭</li>
<li>國(guó)際米蘭</li>
</ul>
</body>
</html>

希望本文所述對(duì)大家的javascript程序設(shè)計(jì)有所幫助。

相關(guān)文章

最新評(píng)論