Javascript显示和隐藏ul列表的方法


Posted in Javascript onJuly 15, 2015

本文实例讲述了Javascript显示和隐藏ul列表的方法。分享给大家供大家参考。具体如下:

<ul id="rightNav">
 <li>
 <h2 class="rightNavItem"><a href="#">Show & Hide</a></h2>
 <ul>
 <li><a href="">Links etc here</a></li>
 </ul>
 </li>
</ul>
<script>
function enableRightNavExpand() {
 if (!document.getElementById) return false;
 if (!document.getElementById("rightNav")) return false;
 var nav = document.getElementById("rightNav");
 var navItem = nav.getElementsByTagName("li");
 for (var i = 0; i < navItem.length; i++){
  navItem[i].onclick=function() {
   if (this.className == "selected") {
    this.className = "";
   }
   else if (this.className == ""){
    this.className = "selected";
   }
  }
 }
}
</script>

希望本文所述对大家的javascript程序设计有所帮助。

Javascript 相关文章推荐
用javascript动态调整iframe高度的方法
Mar 06 Javascript
JavaScript 使用技巧精萃(.net html
Apr 25 Javascript
Javascript执行效率全面总结
Nov 04 Javascript
jquery中animate的stop()方法作用实例分析
Jan 30 Javascript
Angularjs---项目搭建图文教程
Jul 08 Javascript
基于Bootstrap的网页设计实例
Mar 01 Javascript
微信小程序手势操作之单触摸点与多触摸点
Mar 10 Javascript
使用vue.js写一个tab选项卡效果
Mar 25 Javascript
Angular 表单控件示例代码
Jun 26 Javascript
全面分析JavaScript 继承
May 30 Javascript
layui输入框中只允许输入整数的实现方法
Sep 18 Javascript
原生JavaScript实现弹幕组件的示例代码
Oct 12 Javascript
jQuery实现提示密码强度的代码
Jul 15 #Javascript
浅谈javascript中return语句
Jul 15 #Javascript
jQuery实现平滑滚动页面到指定锚点链接的方法
Jul 15 #Javascript
javascript实现在线客服效果
Jul 15 #Javascript
jQuery实现的进度条效果
Jul 15 #Javascript
jQuery中(function($){})(jQuery)详解
Jul 15 #Javascript
jQuery的事件委托实例分析
Jul 15 #Javascript
You might like
「OVERLORD」动画重要删减!雅儿贝德的背叛?至尊猎杀队结成
2020/04/09 日漫
PHP中$_SERVER的详细参数与说明
2008/07/29 PHP
eaglephp使用微信api接口开发微信框架
2014/01/09 PHP
用php守护另一个php进程的例子
2015/02/13 PHP
php常用正则函数实例小结
2016/12/29 PHP
Javascript的一种模块模式
2008/03/22 Javascript
Extjs Ajax 乱码问题解决方案
2009/04/15 Javascript
Firefox outerHTML实现代码
2009/06/04 Javascript
js限制textarea每行输入字符串长度的代码
2012/10/31 Javascript
JS删除数组元素的函数介绍
2013/03/27 Javascript
根据选择不同的下拉值出现相对应的文本输入框
2013/08/01 Javascript
node.js中的fs.readdirSync方法使用说明
2014/12/17 Javascript
AngularJS基础学习笔记之控制器
2015/05/10 Javascript
javascript实现获取浏览器版本、浏览器类型
2015/12/02 Javascript
尝试动手制作javascript放大镜效果
2015/12/25 Javascript
jQueryUI中的datepicker使用方法详解
2016/05/25 Javascript
使用微信小程序开发前端【快速入门】
2016/12/05 Javascript
Node.js学习入门
2017/01/03 Javascript
微信小程序canvas实现刮刮乐效果
2018/07/09 Javascript
js事件on动态绑定数据,绑定多个事件的方法
2018/09/15 Javascript
基于vue实现圆形菜单栏组件
2019/07/05 Javascript
Node.js Domain 模块实例详解
2020/03/18 Javascript
python list语法学习(带例子)
2013/11/01 Python
不归路系列:Python入门之旅-一定要注意缩进!!!(推荐)
2019/04/16 Python
浅谈ROC曲线的最佳阈值如何选取
2020/02/28 Python
CSS3中的clip-path使用攻略
2015/08/03 HTML / CSS
详解HTML5中div和section以及article的区别
2015/07/14 HTML / CSS
JAVA程序设计笔试题面试题一套
2015/07/28 面试题
计算机专业个人简短的自我评价
2013/10/23 职场文书
团干部培训方案
2014/06/03 职场文书
企业战略合作意向书
2015/05/08 职场文书
酒吧七夕情人节宣传语
2015/11/24 职场文书
医德医风学习心得体会
2016/01/25 职场文书
golang在GRPC中设置client的超时时间
2021/04/27 Golang
基于tensorflow权重文件的解读
2021/05/26 Python
Python用any()函数检查字符串中的字母以及如何使用all()函数
2022/04/14 Python