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中的Array 对象(数组对象)
Jun 02 Javascript
移动端H5开发 Turn.js实现很棒的翻书效果
Jun 20 Javascript
vue-router路由简单案例介绍
Feb 21 Javascript
Vue项目组件化工程开发实践方案
Jan 09 Javascript
vue-cli 2.*中导入公共less文件的方法步骤
Nov 22 Javascript
Vuex的初探与实战小结
Nov 26 Javascript
原生js实现移动端Touch轮播图的方法步骤
Jan 03 Javascript
详解VUE调用本地json的使用方法
May 15 Javascript
javascript二维数组和对象的深拷贝与浅拷贝实例分析
Oct 26 Javascript
uni-app 组件里面获取元素宽高的实现
Dec 27 Javascript
js canvas实现俄罗斯方块
Oct 11 Javascript
教你部署vue项目到docker
Apr 05 Vue.js
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实现httpclient类示例
2014/04/08 PHP
php实现文本数据导入SQL SERVER
2015/05/17 PHP
基于php数组中的索引数组和关联数组详解
2018/03/12 PHP
php实现微信公众平台发红包功能
2018/06/14 PHP
用Javascript实现UTF8编码转换成gb2312编码
2006/12/22 Javascript
JQuery 动画卷页 返回顶部 动画特效(兼容Chrome)
2010/02/15 Javascript
jQuery获取css z-index在各种浏览器中的返回值
2010/09/15 Javascript
JS模拟面向对象全解(一、类型及传递)
2011/07/13 Javascript
jquery上传插件fineuploader上传文件使用方法(jquery图片上传插件)
2013/12/05 Javascript
AngularJS仿苹果滑屏删除控件
2016/01/18 Javascript
原生JS取代一些JQuery方法的简单实现
2016/09/20 Javascript
js实现上传按钮并显示缩略图小轮子
2020/05/04 Javascript
python使用socket进行简单网络连接的方法
2015/04/29 Python
Python彩色化Linux的命令行终端界面的代码实例分享
2016/07/02 Python
Python SQLite3数据库日期与时间常见函数用法分析
2017/08/14 Python
Django 登陆验证码和中间件的实现
2018/08/17 Python
对python中词典的values值的修改或新增KEY详解
2019/01/20 Python
Python 线程池用法简单示例
2019/10/02 Python
使用IPython或Spyder将省略号表示的内容完整输出
2020/04/20 Python
Python常用数字处理基本操作汇总
2020/09/10 Python
CSS3中利用animation属性创建雪花飘落特效
2014/05/14 HTML / CSS
一款纯css3实现的动画加载导航
2014/10/08 HTML / CSS
详解Html5微信支付爬坑之路
2018/07/24 HTML / CSS
深入解析HTML5的IndexedDB索引数据库
2015/09/14 HTML / CSS
canvas绘制圆角头像的实现方法
2019/01/17 HTML / CSS
Raleigh兰令自行车美国官网:英国凤头牌自行车
2018/01/08 全球购物
李维斯法国官网:Levi’s法国
2019/07/13 全球购物
乌克兰巴士票购买网站:inBus
2021/03/12 全球购物
卫校毕业生自我鉴定
2013/10/31 职场文书
大一期末自我鉴定
2013/12/13 职场文书
圣诞节红领巾广播稿
2014/02/03 职场文书
离婚协议书怎么写2014
2014/09/30 职场文书
2015年世界无烟日活动方案
2015/05/04 职场文书
商标侵权律师函
2015/05/27 职场文书
小学生读书笔记
2015/07/01 职场文书
厉害!这是Redis可视化工具最全的横向评测
2021/07/15 Redis