javaScript基础练习题-下拉框制作详解编程语言

1.基础回顾

如何让一个段javascript在文档加载后执行,(因为自己忘了,所以顺便复习一下)

window.onload = function(){};

<!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>无标题文档</title> 
<style type="text/css"> 
*{ margin:0px; padding:0px;} 
 #menu{ background-color:#eee; width:600px; height:40px; margin:0 auto;} 
 ul{ list-style:none;} 
 ul li{ line-height:40px; text-align:center; position:relative; float:left;} 
 a{ text-decoration:none; color:#000; display:block; width:90px;} 
 a:hover{ color:#FFF; background-color:#666;} 
 ul li ul li{ float:none;margin-top:2px; background-color:#eee; }  
 ul li ul{width:90px; position:absolute;  left: 0px;top: 40px; display: none} 
/** ?*/ 
/**ul li:hover ul{display: block}*/ 
</style> 
<script type="text/javascript" > 
    window.onload = function(){ 
        alert("load ok"); 
    } 
    function optionShow(li) { 
        var submenu = li.getElementsByTagName("ul")[0]; 
        submenu.style.display = "block"; 
    } 
    function optionHide(li) { 
        var submenu = li.getElementsByTagName("ul")[0]; 
        submenu.style.display = "none"; 
    } 
 
</script> 
</head> 
 
<body> 
<div id="menu"> 
<ul> 
  <li id="sy"><a href="#">首页</a></li> 
  <li id="kcdt"><a href="#">课程大厅</a> 
     
   <!-- ?--> 
    <ul> 
        <li><a href="#">JavScript</a></li> 
        <li><a href="#">JQuery</a></li> 
    </ul> 
  </li> 
  <li onmouseover="optionShow(this);" onmouseout="optionHide(this);"><a href="#">学习中心</a> 
    <ul> 
      <li><a href="#">视频学习</a></li> 
      <li><a href="#">案例学习</a></li> 
      <li><a href="#">交流平台</a></li> 
    </ul> 
  </li> 
  <li><a href="#">经典案例</a></li> 
  <li><a href="#">关于我们</a></li> 
</ul> 
</div>  
</body> 
</html>

原创文章，作者：ItWorker，如若转载，请注明出处：https://blog.ytso.com/tech/pnotes/15407.html

javaScript基础练习题-下拉框制作详解编程语言

相关推荐

发表回复