1.基础回顾

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

window.onload = function(){};

  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml">
  3. <head>
  4. <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  5. <title>无标题文档</title>
  6. <style type="text/css">
  7. *{ margin:0px; padding:0px;}
  8.  #menu{ background-color:#eee; width:600px; height:40px; margin:0 auto;}
  9.  ul{ list-style:none;}
  10.  ul li{ line-height:40px; text-align:center; position:relative; float:left;}
  11.  a{ text-decoration:none; color:#000; display:block; width:90px;}
  12.  a:hover{ color:#FFF; background-color:#666;}
  13.  ul li ul li{ float:none;margin-top:2px; background-color:#eee; }
  14.  ul li ul{width:90px; position:absolute;  left: 0px;top: 40px; display: none}
  15. /** ?*/
  16. /**ul li:hover ul{display: block}*/
  17. </style>
  18. <script type="text/javascript" >
  19.     window.onload = function(){
  20.         alert("load ok");
  21.     }
  22.     function optionShow(li) {
  23.         var submenu = li.getElementsByTagName("ul")[0];
  24.         submenu.style.display = "block";
  25.     }
  26.     function optionHide(li) {
  27.         var submenu = li.getElementsByTagName("ul")[0];
  28.         submenu.style.display = "none";
  29.     }
  30.  
  31. </script>
  32. </head>
  33.  
  34. <body>
  35. <div id="menu">
  36. <ul>
  37.   <li id="sy"><a href="#">首页</a></li>
  38.   <li id="kcdt"><a href="#">课程大厅</a>
  39.  
  40.    <!-- ?-->
  41.     <ul>
  42.         <li><a href="#">JavScript</a></li>
  43.         <li><a href="#">JQuery</a></li>
  44.     </ul>
  45.   </li>
  46.   <li onmouseover="optionShow(this);" onmouseout="optionHide(this);"><a href="#">学习中心</a>
  47.     <ul>
  48.       <li><a href="#">视频学习</a></li>
  49.       <li><a href="#">案例学习</a></li>
  50.       <li><a href="#">交流平台</a></li>
  51.     </ul>
  52.   </li>
  53.   <li><a href="#">经典案例</a></li>
  54.   <li><a href="#">关于我们</a></li>
  55. </ul>
  56. </div>
  57. </body>
  58. </html>

javaScript基础练习题-下拉框制作的更多相关文章

  1. javaScript基础练习题-下拉框制作(JQuery)

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  2. javaScript基础练习题-下拉框制作(CSS)

    http://www.imooc.com/video/155 慕课网的视频,直接上代码 <!DOCTYPE hmtl> <html> <head> <meta ...

  3. javaScript基础练习题-下拉框制作(神奇的代码)

    http://www.oschina.net/code/snippet_12_46548#66319 http://www.codeproject.com/Tips/890021/Advanced-C ...

  4. JavaScript向select下拉框中加入和删除元素

    JavaScript向select下拉框中加入和删除元素 1.说明 a   利用append()方法向下拉框中加入元素 b   利用remove()方法移除下拉框中最后一个元素 2.设计源代码 < ...

  5. JavaScript向select下拉框中添加和删除元素

    JavaScript向select下拉框中添加和删除元素 1.说明 a   利用append()方法向下拉框中添加元素 b   利用remove()方法移除下拉框中最后一个元素 2.设计源码 < ...

  6. JavaScript解决select下拉框中的内容太长显示不全的问题

    JavaScript解决select下拉框中的内容太长显示不全的问题 1.说明 有些情况下,select下拉框的内容过长,导致部分看不见: 现在通过鼠标事件,让下拉框中的内容显示完全 2.实现源码 & ...

  7. JavaScript获取select下拉框中的第一个值

    JavaScript获取select下拉框中的第一个值 1.说明 获取select下拉框中的第一个值 2.实现源码 <!DOCTYPE html PUBLIC "-//W3C//DTD ...

  8. Javascript获取select下拉框选中的的值

    现在有一id=test的下拉框,怎么拿到选中的那个值呢? 分别使用javascript原生的方法和jquery方法 <select id="test"  name=" ...

  9. JavaScript获取Select下拉框Option的Value和Text值的方法

    Js获取select下拉列表框各个Option的Value值相对比较容易,不过获取Text值却有点麻烦,对于一个初学JavaScript的 新手来说,可能一时还无从下手,那么就请看下本文的方法,以一个 ...

随机推荐

  1. Android代码优化----Application节点的模板写法及UI工具类

    一. MyApplication类的编写: 新建一个类MyApplication,继承自Application.代码如下: MyApplication.java: package com.smyhva ...

  2. View （四）视图状态及重绘流程分析

    相 信大家在平时使用View的时候都会发现它是有状态的,比如说有一个按钮,普通状态下是一种效果,但是当手指按下的时候就会变成另外一种效果,这样才会给 人产生一种点击了按钮的感觉.当然了,这种效果相信几 ...

  3. C++ c++与C语言的区别（实用性增强，register关键字增强，全局变量检测增强）

    //区别①:实用性增强 #include<iostream> using namespace std; //C语言中的变量都必须在作用域开始的位置定义!! //C++中更强调语言的“实用性 ...

  4. 浅谈VC++中预编译的头文件放那里的问题分析

    用C++写程序,肯定要用预编译头文件,就是那个stdafx.h.不过我一直以为只要在.cpp文件中包含stdafx.h 就使用了预编译头文件,其实不对.在VC++中,预编译头文件是指放到stdafx. ...

  5. 使用js使某个按钮在5秒内不能重复点击

    <head> <!--参考:http://illy.iteye.com/blog/1534276 --> <!-- http://y.dobit.top/Detail/1 ...

  6. php基础15：表单验证

    <?php $nameError=$emailError=$genderError=$websiteError=""; $name=$email=$gender=$comme ...

  7. StringBuffer类 和 StringBuilder类

    上一篇中讲解了String类的用法.那么String有什么特点呢? 字符串特点:字符串是常量,其值在创建后就不能被修改.字符串的内容一旦发生变化,就会创建一个新的对象. 代码验证字符串特点: publ ...

  8. Ant 执行 YUICompressor

    Ant 执行 YUICompressor 任务压缩 JavaScript 和 CSS 文件,解决中文乱码问题,增加源文件字符编码集设定 标签: javascriptantcss任务encodingnu ...

  9. [CareerCup] 3.3 Set of Stacks 多个栈

    3.3 Imagine a (literal) stack of plates. If the stack gets too high, it might topple. Therefore, in ...

  10. LeetCode:Clone Graph

    题目如下:实现克隆图的算法  题目链接 Clone an undirected graph. Each node in the graph contains a label and a list of ...