用JS实现一个TreeMenu效果分享


Posted in Javascript onAugust 28, 2011

今天学的一点小东西和大家分享一下。
类似TreeMenu控件.
不废话直接代码:

<script language="javascript"> 
function control() {//定义函数 
if (sMenus3.innerHTML == "+") {//判断展开状态 
ulMenu3.style.display = "block";//如果是“+”号 则可以展开 
sMenus3.innerText = "-";//展开之后显示为减号 
} 
else { 
ulMenu3.style.display = "none";//如果为“-”号 则不能展开 
sMenus3.innerText = "+";//点击之后符号变换。 
} 
} 
</script>

Html 代码:
//这段代码没什么说的 主要就是Id 和js代码中的Id对应。
<body> 
<span id="sMenus3" style=" border:1px solid #00000; color:Blue;cursor:hand ;" onclick="control()">-</span>无网站状态<br/> 
<ul id="ulMenu3"> 
<li><a href="http://www.baidu.com" target="_blank">百度</a> </li> 
<li><a href="http://www.baidu.com" target="_parent">百度</a></li> 
<li><a href="http://www.baidu.com" target="_blank">还是百度</a></li> 
</ul> 
</body>
Javascript 相关文章推荐
javascript getElementsByName()的用法说明
Jul 31 Javascript
PHP中CURL的几个经典应用实例
Jan 23 Javascript
JavaScript中数据结构与算法(五):经典KMP算法
Jun 19 Javascript
JS获取下拉框显示值和判断单选按钮的方法
Jul 09 Javascript
jquery表单验证插件validation使用方法详解
Jan 20 Javascript
Iphone手机、安卓手机浏览器控制默认缩放大小的方法总结(附代码)
Aug 18 Javascript
vue实现页面加载动画效果
Sep 19 Javascript
vue+vuex+axios+echarts画一个动态更新的中国地图的方法
Dec 19 Javascript
redux-saga 初识和使用
Mar 10 Javascript
使用vue脚手架(vue-cli)搭建一个项目详解
May 09 Javascript
javascript实现商品图片放大镜
Nov 28 Javascript
原生JavaScript实现进度条
Feb 19 Javascript
JS target与currentTarget区别说明
Aug 28 #Javascript
IE6,IE7,IE8下使用Javascript记录光标选中范围(已补全)
Aug 28 #Javascript
range 标准化之获取
Aug 28 #Javascript
dojo学习第一天 Tab选项卡 实现
Aug 28 #Javascript
js中设置元素class的三种方法小结
Aug 28 #Javascript
IE6、IE7中setAttribute不支持class/for/rowspan/colspan等属性
Aug 28 #Javascript
IE6、IE7中获取Button元素的值的bug说明
Aug 28 #Javascript
You might like
php类常量用法实例分析
2015/07/09 PHP
php解析url并得到url中的参数及获取url参数的四种方式
2015/10/26 PHP
Thinkphp微信公众号支付接口
2016/08/04 PHP
阿里云PHP SMS短信服务验证码发送方法
2017/07/11 PHP
写js时遇到的一些小问题
2010/12/06 Javascript
IE 下Enter提交表单存在重复提交问题的解决方法
2014/05/04 Javascript
jQuery中:eq()选择器用法实例
2014/12/29 Javascript
JavaScript动态插入CSS的方法
2015/12/10 Javascript
WordPress中鼠标悬停显示和隐藏评论及引用按钮的实现
2016/01/12 Javascript
AngularJS数据源的多种获取方式汇总
2016/02/02 Javascript
react-router实现跳转传值的方法示例
2017/05/27 Javascript
angular-ngSanitize模块-$sanitize服务详解
2017/06/13 Javascript
react native带索引的城市列表组件的实例代码
2017/08/08 Javascript
js将当前时间格式化为 年-月-日 时:分:秒的实现代码
2018/01/20 Javascript
JavaScript实现京东购物放大镜和选项卡效果的方法分析
2018/07/05 Javascript
解决vue-quill-editor上传内容由于图片是base64的导致字符太长的问题
2018/08/20 Javascript
微信小程序实现加入购物车滑动轨迹
2020/11/18 Javascript
[06:21]2014DOTA2国际邀请赛 庆祝VG首阶段领跑;B叔为挣牛排半夜整理情报
2014/07/13 DOTA
Python对wav文件的重采样实例
2020/02/25 Python
python自动下载图片的方法示例
2020/03/25 Python
Python selenium使用autoIT上传附件过程详解
2020/05/26 Python
python 引用传递和值传递详解(实参,形参)
2020/06/05 Python
python实现MySQL指定表增量同步数据到clickhouse的脚本
2021/02/26 Python
CSS3盒子模型详解
2013/04/24 HTML / CSS
详解如何用canvas画一个微笑的表情
2019/03/14 HTML / CSS
HTML5之SVG 2D入门4—笔画与填充
2013/01/30 HTML / CSS
使用html5制作loading图的示例
2014/04/14 HTML / CSS
美国最大的宠物药店:1-800-PetMeds
2016/10/02 全球购物
类的核心特性有哪些
2014/01/01 面试题
元旦晚会策划方案
2014/02/18 职场文书
材料加工工程求职信
2014/02/19 职场文书
关于建议书的格式范文
2014/05/20 职场文书
2014年学校国庆主题活动方案
2014/09/16 职场文书
2016年端午节红领巾广播稿
2015/12/18 职场文书
2017年寒假社区服务活动总结
2016/04/06 职场文书
抖音短视频(douyin)去水印工具的实现代码
2021/03/30 Javascript