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>
javaScript基础练习题-下拉框制作的更多相关文章
- javaScript基础练习题-下拉框制作(JQuery)
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- javaScript基础练习题-下拉框制作(CSS)
http://www.imooc.com/video/155 慕课网的视频,直接上代码 <!DOCTYPE hmtl> <html> <head> <meta ...
- javaScript基础练习题-下拉框制作(神奇的代码)
http://www.oschina.net/code/snippet_12_46548#66319 http://www.codeproject.com/Tips/890021/Advanced-C ...
- JavaScript向select下拉框中加入和删除元素
JavaScript向select下拉框中加入和删除元素 1.说明 a 利用append()方法向下拉框中加入元素 b 利用remove()方法移除下拉框中最后一个元素 2.设计源代码 < ...
- JavaScript向select下拉框中添加和删除元素
JavaScript向select下拉框中添加和删除元素 1.说明 a 利用append()方法向下拉框中添加元素 b 利用remove()方法移除下拉框中最后一个元素 2.设计源码 < ...
- JavaScript解决select下拉框中的内容太长显示不全的问题
JavaScript解决select下拉框中的内容太长显示不全的问题 1.说明 有些情况下,select下拉框的内容过长,导致部分看不见: 现在通过鼠标事件,让下拉框中的内容显示完全 2.实现源码 & ...
- JavaScript获取select下拉框中的第一个值
JavaScript获取select下拉框中的第一个值 1.说明 获取select下拉框中的第一个值 2.实现源码 <!DOCTYPE html PUBLIC "-//W3C//DTD ...
- Javascript获取select下拉框选中的的值
现在有一id=test的下拉框,怎么拿到选中的那个值呢? 分别使用javascript原生的方法和jquery方法 <select id="test" name=" ...
- JavaScript获取Select下拉框Option的Value和Text值的方法
Js获取select下拉列表框各个Option的Value值相对比较容易,不过获取Text值却有点麻烦,对于一个初学JavaScript的 新手来说,可能一时还无从下手,那么就请看下本文的方法,以一个 ...
随机推荐
- 传奇的通迅协议与base64算法
传奇的数据根本就没加密. 只要把#(数字)!去掉,中间的那些全部减0x3c,然后,四个字节一组,每个字节取低六位组成6*4=24位,然后分成3个字节,这个是很经典的base64的算法.不过小改了一些, ...
- 并发用户数与TPS之间的关系
1. 背景 在做性能测试的时候,很多人都用并发用户数来衡量系统的性能,觉得系统能支撑的并发用户数越多,系统的性能就越好:对TPS不是非常理解,也根本不知道它们之间的关系,因此非常有必要进行解释. 2 ...
- HTTP请求与响应方式
HTTP请求格式 当浏览器向Web服务器发出请求时,它向服务器传递了一个数据块,也就是请求信息,HTTP请求信息由3部分组成: l 请求方法URI协议/版本 l 请求头(Request Hea ...
- canvas模仿微信抢红包功能
1.原理:先创建一张img图片,用filter滤镜制作毛玻璃效果. 2.利用绝对定位,使canvas刚好盖在img上面. 3.利用canvas原生clip函数剪辑一个圆形. 地址:http://san ...
- codevs 3012 线段覆盖 4 & 3037 线段覆盖 5
3037 线段覆盖 5 时间限制: 3 s 空间限制: 256000 KB 题目等级 : 钻石 Diamond 题解 题目描述 Description 数轴上有n条线段,线段的两端都 ...
- Eclipse中10个最有用的快捷键组合(转)
Eclipse中10个最有用的快捷键组合 1. ctrl+shift+r:打开资源 这可能是所有快捷键组合中最省时间的了.这组快捷键可以让你打开你的工作区中任何一个文件,而你只需要按下文件名或mask ...
- 在Linux用libcurl.a在链接的时候出错
其实出错是因为curl链接的时候需要别的库.我用如下方法解决 1.http://curl.haxx.se/download/curl-7.45.0.tar.gz官网下载源码 2../configure ...
- WebAPI请求
里我使用Jquery 来发起异步请求实现数据调用. 继续使用上一文章中的示例,添加一个index.html页面,添加对jquery的引用. 一.无参数Get请求 一般的get请求我们可以使用jquer ...
- linux内核分析 期中总结
LINUX内核分析 链接汇总 LINUX内核分析第一周学习总结——计算机是如何工作的 LINUX内核分析第二周学习总结——操作系统是如何工作的 LINUX内核分析第三周学习总结——构造一个简单的Lin ...
- [bzoj 1503][NOI 2004]郁闷的出纳员(平衡树)
题目:http://www.lydsy.com/JudgeOnline/problem.php?id=1503 分析: 经典的平衡树题,我用Treap做的 下面有几点注意的: 1.可能出现新加入的人的 ...