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 相关文章推荐
IE7中javascript操作CheckBox的checked=true不打勾的解决方法
Dec 07 Javascript
复制Input内容的js代码_支持所有浏览器,修正了Firefox3.5以上的问题
Jun 21 Javascript
javascript 实用的文字链提示框效果
Jun 30 Javascript
jQuery.parseJSON(json)将JSON字符串转换成js对象
Jul 27 Javascript
限制文本框只能输入数字||只能是数字和小数点||只能是整数和浮点数
May 27 Javascript
浅谈JS中的!=、== 、!==、===的用法和区别
Sep 24 Javascript
vue.js事件处理器是什么
Mar 20 Javascript
js 监控iframe URL的变化实例代码
Jul 12 Javascript
浅析Vue.js 中的条件渲染指令
Nov 19 Javascript
详解Bootstrap 学习(一)入门
Apr 12 Javascript
jQuery 查找元素操作实例小结
Oct 02 jQuery
vue-property-decorator用法详解
Dec 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
php MySQL与分页效率
2008/06/04 PHP
php读取html并截取字符串的简单代码
2009/11/30 PHP
解析数组非数字键名引号的必要性
2013/08/09 PHP
php+js iframe实现上传头像界面无跳转
2014/04/29 PHP
ThinkPHP使用心得分享-上传类UploadFile的使用
2014/05/15 PHP
bcastr2.0 通用的图片浏览器
2006/11/22 Javascript
jQuery html() in Firefox (uses .innerHTML) ignores DOM changes
2010/03/05 Javascript
ExtJS TabPanel beforeremove beforeclose使用说明
2010/03/31 Javascript
JQuery入门——事件切换之toggle()方法应用介绍
2013/02/05 Javascript
Javascript获取当前日期的农历日期代码
2014/10/08 Javascript
jQuery+CSS3实现3D立方体旋转效果
2015/11/10 Javascript
AngularJS实现一次监听多个值发生的变化
2016/08/31 Javascript
jQuery遍历节点树方法分析
2016/09/08 Javascript
jQuery实现边框动态效果的实例代码
2016/09/23 Javascript
jQuery实现移动端手机商城购物车功能
2016/09/24 Javascript
解决微信内置浏览器返回上一页强制刷新问题方法
2017/02/05 Javascript
解决VUEX刷新的时候出现数据消失
2017/07/03 Javascript
jquery实现回车键触发事件(实例讲解)
2017/11/21 jQuery
vuex进阶知识点巩固
2018/05/20 Javascript
JavaScript面向对象中接口实现方法详解
2019/07/24 Javascript
javascript中this的用法实践分析
2019/07/29 Javascript
一步一步实现Vue的响应式(对象观测)
2019/09/02 Javascript
python在TXT文件中按照某一字符串取出该字符串所在的行方法
2018/12/10 Python
Python使用post及get方式提交数据的实例
2019/01/24 Python
不到20行实现Python代码即可制作精美证件照
2020/04/24 Python
基于Python的自媒体小助手---登录页面的实现代码
2020/06/29 Python
使用Python实现NBA球员数据查询小程序功能
2020/11/09 Python
德国药房apodiscounter中文官网:德国排名前三的网上药店
2019/06/03 全球购物
到底Java是如何传递参数的?是by value或by reference?
2012/07/13 面试题
Ibatis的核心配置文件都有什么
2014/09/08 面试题
面向对象编程的优势是什么
2015/12/17 面试题
营销主管自我评价怎么写
2013/09/19 职场文书
2014年敬老院工作总结
2014/12/08 职场文书
国庆放假通知怎么写
2015/07/30 职场文书
2016年优秀少先队辅导员事迹材料
2016/02/26 职场文书
「月刊Comic Alive」2022年5月号封面公开
2022/03/21 日漫