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>

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. Spring 一二事（2）

    静态工厂方法及实例工厂的使用: applicationContext.xml: <!-- factory-method 是指调用静态工厂方法 --> <bean id="h ...

  2. 第一次使用Android Studio时你应该知道的一切配置（二）：新建一个属于自己的工程并安装Genymotion模拟器

    [声明] 欢迎转载,但请保留文章原始出处→_→ 生命壹号:http://www.cnblogs.com/smyhvae/ 文章来源:http://www.cnblogs.com/smyhvae/p/4 ...

  3. 一款免费好用的正则表达式工具：Regex Match Tracer

    推荐分享:一款免费好用的正则表达式工具:Regex Match Tracer  v2.1.5  free version 下载地址:Regex Match Tracer

  4. jira与readmine区别

    JIRA适合多人的团队(100+),而Readmine适合中小型团队. Redmine是用ruby开发的基于web的项目管理软件,免费.JIRA收费Redmine可以创建子任务,而jira不易创建子任 ...

  5. Spring之AOP

    package org.zln.module.test3_aop.interceptor; import org.aspectj.lang.ProceedingJoinPoint; import or ...

  6. C# 无边框窗体边框阴影效果

    通过下面代码在构造函数中调用方法 SetShadow(); 即可实现无边框窗体的阴影效果了 需要添加命名空间 using System.Runtime.InteropServices; private ...

  7. 【原创】有关Silverlight中“DataGrid中单元格动态绑定ComboBox单击时数据项莫名被清除 ”的解决方案及思路。

    今天上班遇到一个很古怪的问题,搞了半天愣是没找到原因.是这样的,在Datagrid中有绑定一个ComboBox列,其不包含在 model数据中,而是单独在LoadingRow事件中去 从数据库拿数据绑 ...

  8. ES配置文件参考与参数详解

    cluster.name: data-cluster node.name: "data-es-05" #node.data: false # Indexing & Cach ...

  9. Tasks.Parallel

    .Net多线程编程-System.Threading.Tasks.Parallel   System.Threading.Tasks.Parallel类提供了Parallel.Invoke,Paral ...

  10. 目标检测——HOG特征

    1.HOG特征: 方向梯度直方图(Histogram of Oriented Gradient, HOG)特征是一种在计算机视觉和图像处理中用来进行物体检测的特征描述子.它通过计算和统计图像局部区域的 ...