UL及LI元素的控制 - HttpConnTestDemo

来源：互联网发布：美工外包合同编辑：程序博客网时间：2024/06/06 08:31
UL及对其中LI元素的设置。
<!--      Description: UL及LI元素的控制。      Author: xiaolong    Date:  2009年9月10日, 9:59:17  -->    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">  <html>    <head>            <title>My JSP 'testHttpConn.jsp' starting page</title>            <meta http-equiv="pragma" content="no-cache">      <meta http-equiv="cache-control" content="no-cache">      <meta http-equiv="expires" content="0">      <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">      <meta http-equiv="description" content="This is my page">            <!--      <link rel="stylesheet" type="text/css" href="styles.css" mce_href="styles.css">      -->            <style>    <!--          #sfxUl{              list-style:none;              float:left;          }                    #sfxUl li{              float: left;              padding:0px 25px;              text-align:center;          }                    .liCls {              color:blue;              font-size:13px;          }                    .liCls_Over {              text-decoration:none;              font-size:13px;              cursor:hand;              color:#fff;              background-color:#3399CC;          }        --></style>          <script type="text/javascript"><!--          function fillSfx(val){              document.urldetail.urlSuffix.value=val;          }                    startList=function(){              if(document.all&&document.getElementById){                  sfxUlRoot=document.getElementById("sfxUl");                                    if(sfxUlRoot!=null){                      //alert(sfxUlRoot.childNodes.length);                      for(i=0;i<sfxUlRoot.childNodes.length;i++){                          liNode=sfxUlRoot.childNodes[i];                          if(liNode.nodeName=="LI"){                              liNode.className="liCls";                              liNode.onmouseover=function(){                                  this.className+="_Over";                              }                              liNode.onmouseout=function(){                                  this.className=this.className.replace("_Over","");                              }                          }//if                      }//for                  }              }//if          }//startList                    window.onload=startList;          -->      </script>    </head>        <body >      <br>      <br>            <form name="urldetail" action="" method="post">          请输入URL后缀：<input name="urlSuffix" type="text" value=""></input>          <input type="submit" value="提交"></input>      </form>        常用后缀：  <ul id="sfxUl">  <li val="/login/" onClick="fillSfx(this.val);">login包</li>  <li val="/web/mcc/" onClick="fillSfx(this.val);">web包</li>  </ul>                        <br><br>      <br>      <table width="758" border=1 cellPadding=1 cellSpacing=1 align=center style="table-layout: fixed; word-break: break-all" mce_style="table-layout: fixed; word-break: break-all">      <tr>          <td width="5%">1</td>          <td width="75%"><a href="http://123.121.121.2:9000/" mce_href="http://123.121.121.2:9000/" target="_blank">http://123.121.121.2:9000/</a></td>          <td width="20%">连接失败</td>      </tr>      <tr>          <td width="5%">2</td>          <td width="75%"><a href="http://13.132.32.8:9081/" mce_href="http://13.132.32.8:9081/" target="_blank">http://13.132.32.8:9081/</a></td>          <td width="20%">连接失败</td>      </tr>        </TABLE>      </body>  </html>