JavaScript中的style.display属性操作


Posted in Javascript onMarch 27, 2013

display版本:CSS1/CSS2    兼容性:IE4+   NS4+ 继承性:无  

语法:
     
display   :   block   |   none   |   inline   |   compact   |   marker   |   inline-table   |   list-item   |   run-in   |   table   |table-caption   |   table-cell   |   table-column   |   table-column-group   |   table-footer-group   |   table-header-group   |   table-row   |   table-row-group    

参数:    

block   :    CSS1 块对象的默认值。用该值为对象之后添加新行    
none   :    CSS1 隐藏对象。与visibility属性的hidden值不同,其不为被隐藏的对象保留其物理空间    
inline   :    CSS1 内联对象的默认值。用该值将从对象中删除行    
compact   :    CSS2 分配对象为块对象或基于内容之上的内联对象    
marker   :    CSS2 指定内容在容器对象之前或之后。要使用此参数,对象必须和:after及:before   伪元素一起使用    
inline-table   :    CSS2 将表格显示为无前后换行的内联对象或内联容器    
list-item   :    CSS1 将块对象指定为列表项目。并可以添加可选项目标志    
run-in   :    CSS2 分配对象为块对象或基于内容之上的内联对象    
table   :    CSS2 将对象作为块元素级的表格显示    
table-caption   :    CSS2 将对象作为表格标题显示    
table-cell   :    CSS2 将对象作为表格单元格显示    
table-column   :    CSS2 将对象作为表格列显示    
table-column-group   :    CSS2 将对象作为表格列组显示    
table-header-group   :    CSS2 将对象作为表格标题组显示    
table-footer-group   :    CSS2 将对象作为表格脚注组显示    
table-row   :    CSS2 将对象作为表格行显示    
table-row-group   :    CSS2 将对象作为表格行组显示    

说明:    

设置或检索对象是否及如何显示。  
目前   IE5.5仅支持以上CSS1的参数。    
对应的脚本特性为display。请参阅我编写的其他书目。

下面给个例子:点击显示或隐藏

<script language="JavaScript">
function show(str){
var i=documeng.getElementById(str);
if (i.style.display == "none") {     
   i.style.display = "";     
}
else{     
   i.style.display = "none";     
}     
}      
</script>
Javascript 相关文章推荐
Javascript 面向对象(一)(共有方法,私有方法,特权方法)
May 23 Javascript
JS和函数式语言的三特性
Mar 05 Javascript
jQuery实现购物车表单自动结算效果实例
Aug 10 Javascript
javascript-解决mongoose数据查询的异步操作
Dec 22 Javascript
js实现符合国情的日期插件详解
Jan 19 Javascript
浅谈js for循环输出i为同一值的问题
Mar 01 Javascript
vue.js轮播图组件使用方法详解
Jul 03 Javascript
浅谈在react中如何实现扫码枪输入
Jul 04 Javascript
vue里如何主动销毁keep-alive缓存的组件
Mar 21 Javascript
Vue数字输入框组件使用方法详解
Feb 10 Javascript
js实现超级玛丽小游戏
Mar 18 Javascript
vuecli3.x中轻松4步带你使用tinymce的步骤
Jun 25 Javascript
jquery ajax提交整个表单元素的快捷办法
Mar 27 #Javascript
jQuery渐变发光导航菜单的实例代码
Mar 27 #Javascript
鼠标放在图片上显示大图的JS代码
Mar 26 #Javascript
javascript数组去重3种方法的性能测试与比较
Mar 26 #Javascript
两种常用的javascript数组去重方法思路及代码
Mar 26 #Javascript
javascript变量作用域使用中常见错误总结
Mar 26 #Javascript
定时器(setTimeout/setInterval)调用带参函数失效解决方法
Mar 26 #Javascript
You might like
php 操作数组(合并,拆分,追加,查找,删除等)
2012/07/20 PHP
php计算程序运行时间的简单例子分享
2014/05/10 PHP
ThinkPHP模板判断输出Present标签用法详解
2014/06/30 PHP
ThinkPHP模板中判断volist循环的最后一条记录的验证方法
2014/07/01 PHP
如何使用GDB调试PHP程序
2015/12/08 PHP
thinkphp分页实现效果
2016/10/13 PHP
PHP实现字符串大小写转函数的功能实例
2019/02/06 PHP
2007/12/23更新创意无限,简单实用(javascript log)
2007/12/24 Javascript
js中Math之random,round,ceil,floor的用法总结
2013/12/26 Javascript
jQuery新的事件绑定机制on()示例应用
2014/07/18 Javascript
js实现带缓冲效果的仿QQ面板折叠菜单代码
2015/09/06 Javascript
JS控件bootstrap datepicker使用方法详解
2017/03/25 Javascript
Javascript实现从小到大的数组转换成二叉搜索树
2017/06/13 Javascript
浅谈mvvm-simple双向绑定简单实现
2018/04/18 Javascript
vue 框架下自定义滚动条(easyscroll)实现方法
2019/08/29 Javascript
nodejs dgram模块广播+组播的实现示例
2019/11/04 NodeJs
js实现星星打分效果
2020/07/05 Javascript
Python中的rjust()方法使用详解
2015/05/19 Python
Python基础篇之初识Python必看攻略
2016/06/23 Python
Python基于回溯法子集树模板解决旅行商问题(TSP)实例
2017/09/05 Python
python+matplotlib绘制饼图散点图实例代码
2018/01/20 Python
python求解数组中两个字符串的最小距离
2018/09/27 Python
Python2比较当前图片跟图库哪个图片相似的方法示例
2019/09/28 Python
Python中断多重循环的思路总结
2019/10/04 Python
Window系统下Python如何安装OpenCV库
2020/03/05 Python
Python定义函数实现累计求和操作
2020/05/03 Python
HTML5网页录音和上传到服务器支持PC、Android,支持IOS微信功能
2019/04/26 HTML / CSS
捷克汽车配件和工具销售网站:TorriaCars
2018/02/26 全球购物
什么是规则表达式
2012/05/03 面试题
社会保险接收函
2014/01/12 职场文书
电厂职工自我鉴定
2014/02/20 职场文书
2014年物业公司工作总结
2014/11/22 职场文书
师德先进个人材料
2014/12/20 职场文书
感谢信范文大全
2015/01/23 职场文书
3招让你摆脱即兴讲话冷场尴尬
2019/08/08 职场文书
读鲁迅先生的经典名言
2019/08/20 职场文书