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 相关文章推荐
jquery图片滚动放大代码分享(1)
Aug 25 Javascript
原生JS实现风箱式demo,并封装了一个运动框架(实例代码)
Jul 22 Javascript
浅谈JS继承_借用构造函数 &amp; 组合式继承
Aug 16 Javascript
js带闹铃功能的倒计时代码
Sep 29 Javascript
Bootstrap基本组件学习笔记之列表组(11)
Dec 07 Javascript
JS树形菜单组件Bootstrap TreeView使用方法详解
Dec 21 Javascript
简单的JS控制button颜色随点击更改的实现方法
Apr 17 Javascript
iscroll实现下拉刷新功能
Jul 18 Javascript
webpack4.x CommonJS模块化浅析
Nov 09 Javascript
Vue.js 无限滚动列表性能优化方案
Dec 02 Javascript
JS实现电商商品展示放大镜特效
Jan 07 Javascript
vue3不同环境下实现配置代理
May 25 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
网站当前的在线人数
2006/10/09 PHP
php学习笔记 PHP面向对象的程序设计
2011/06/13 PHP
Sorting Array Values in PHP(数组排序)
2011/09/15 PHP
ThinkPHP的cookie和session冲突造成Cookie不能使用的解决方法
2014/07/01 PHP
PHP+swoole实现简单多人在线聊天群发
2016/01/19 PHP
PHP-FPM的配置与优化讲解
2019/03/15 PHP
通过PHP的Wrapper无缝迁移原有项目到新服务的实现方法
2020/04/02 PHP
理解Javascript_13_执行模型详解
2010/10/20 Javascript
JavaScript高级程序设计(第3版)学习笔记9 js函数(下)
2012/10/11 Javascript
JS、DOM和JQuery之间的关系示例分析
2014/04/09 Javascript
使用jquery.form.js实现图片上传的方法
2016/05/05 Javascript
基于Angularjs实现分页功能
2016/05/30 Javascript
javascript容错处理代码(屏蔽js错误)
2017/01/20 Javascript
深究AngularJS中$sce的使用
2017/06/12 Javascript
一次围绕setTimeout的前端面试经验分享
2017/06/15 Javascript
JavaScript实现图片无缝滚动效果
2017/07/07 Javascript
微信小程序三级联动地址选择器的实例代码
2017/07/12 Javascript
vue-cli + sass 的正确打开方式图文详解
2017/10/27 Javascript
vue transition 在子组件中失效的解决
2019/11/12 Javascript
深入理解 TypeScript Reflect Metadata
2019/12/12 Javascript
[46:55]Ti4 冒泡赛第二轮 LGD vs C9
2014/07/14 DOTA
Python struct模块解析
2014/06/12 Python
Django应用程序中如何发送电子邮件详解
2017/02/04 Python
Python与R语言的简要对比
2017/11/14 Python
解决Python网页爬虫之中文乱码问题
2018/05/11 Python
jupyter notebook 增加kernel教程
2020/04/10 Python
python nohup 实现远程运行不宕机操作
2020/04/16 Python
如何使用PyCharm引入需要使用的包的方法
2020/09/22 Python
Pycharm创建文件时自动生成文件头注释(自定义设置作者日期)
2020/11/24 Python
Whittard官方海外旗舰店:英国百年茶叶品牌
2018/02/22 全球购物
输入一行文字,找出其中大写字母、小写字母、空格、数字、及其他字符各有多少
2016/04/15 面试题
杭州时比特电子有限公司SQL
2013/08/22 面试题
团日活动策划书
2014/02/01 职场文书
大二学生自我检讨书
2014/10/23 职场文书
长城英文导游词
2015/01/30 职场文书
2017公司年会主持人开幕词
2016/03/04 职场文书