• 技术文章 >web前端 >js教程

    js将控件隐藏及display属性的使用介绍_javascript技巧

    2016-05-16 17:06:12原创585
    用JavaScript隐藏控件的方法有两种,分别是通过设置控件的style的“display”和“visibility”属性。当style.display="block"或style.visibility="visible"时控件或见,当style.display="none"或style.visibility="hidden"时控件不可见。不同的是“display”不但隐藏控件,而且被隐藏的控件不再占用显示时占用的位置,而“visibility”隐藏的控件仅仅是将控件设置成不可见了,控件仍然占俱原来的位置。
    复制代码 代码如下:

    function displayHideUI()
    {
    var ui = document.getElementById("bbs");
    ui.style.display="none";
    }
    function displayShowUI()
    {
    var ui = document.getElementById("bbs");
    ui.style.display=" ";//display为空的话会好使,为block会使后边的空间换行
    }

    function visibilityHideUI()
    {
    var ui = document.getElementById("bbs");
    ui.style.visibility="hidden";
    }
    function visibilityShowUI()
    {
    var ui = document.getElementById("bbs");
    ui.style.visibility="visible";
    }



    值 描述
    none 此元素不会被显示。
    block 此元素将显示为块级元素,此元素前后会带有换行符。
    inline 默认。此元素会被显示为内联元素,元素前后没有换行符。
    inline-block 行内块元素。(CSS2.1 新增的值)
    list-item 此元素会作为列表显示。
    run-in 此元素会根据上下文作为块级元素或内联元素显示。
    compact CSS 中有值compact,不过由于缺乏广泛支持,已经从CSS2.1 中删除。
    marker CSS 中有值marker,不过由于缺乏广泛支持,已经从CSS2.1 中删除。
    table 此元素会作为块级表格来显示(类似),表格前后带有换行符。
    inline-table 此元素会作为内联表格来显示(类似
    ),表格前后没有换行符。
    table-row-group 此元素会作为一个或多个行的分组来显示(类似)。
    table-header-group 此元素会作为一个或多个行的分组来显示(类似)。
    table-footer-group 此元素会作为一个或多个行的分组来显示(类似)。
    table-row 此元素会作为一个表格行显示(类似)。
    table-column-group 此元素会作为一个或多个列的分组来显示(类似)。
    table-column 此元素会作为一个单元格列显示(类似)
    table-cell 此元素会作为一个表格单元格显示(类似

    table-caption 此元素会作为一个表格标题显示(类似


    inherit 规定应该从父元素继承display 属性的值。
    声明:本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn核实处理。

    前端(VUE)零基础到就业课程:点击学习

    清晰的学习路线+老师随时辅导答疑

    自己动手写 PHP MVC 框架:点击学习

    快速了解MVC架构、了解框架底层运行原理

    上一篇:屏蔽IE弹出"您查看的网页正在试图关闭窗口,是否关闭此窗口"的方法_javascript技巧 下一篇:自己动手写 PHP MVC 框架(40节精讲/巨细/新人进阶必看)

      相关课程推荐

    • 独孤九贱(3)_JavaScript视频教程

      javascript是运行在浏览器上的脚本语言,连续多年,被评为全球最受欢迎的编程语言。是前端开发必备三大法器中,最具杀伤力。如果前端开发是降龙十八掌,好么javascript就是第18掌:亢龙有悔。没有它,你的前端生涯是不完整的。《php.cn独孤九贱(3)-JavaScript视频教程》课程特色:php中文网原创幽默段子系列课程,以恶搞,段子为主题风格的php视频教程!轻松的教学风格,简短的教学模式,让同学们在不知不觉中,学会了javascript知识。

      JavaScript教程139794次播放


    • 独孤九贱(6)_jQuery视频教程

      jQuery是一个快速、简洁的JavaScript框架。设计的宗旨是“write Less,Do More”,即倡导写更少的代码,做更多的事情。它封装JavaScript常用的功能代码,提供一种简便的JavaScript设计模式,优化HTML文档操作、事件处理、动画设计和Ajax交互。 核心特性可以总结为:具有独特的链式语法和短小清晰的多功能接口;具有高效灵活的css选择器,并且可对CSS选择器进行扩展;拥有便捷的插件扩展机制和丰富的插件。兼容各种主流浏览器,如IE 6.0+、FF 1.5+、Safari 2.0+、Opera 9.0+等,是全球最流行的前端开发框架之一。PHP中文网根据最新版本,独家录制jQuery最新视频教程,回馈PHP中文网的新老用户。

      jQuery教程114876次播放


    • jQuery与Ajax基础与实战

      jQuery是最流行的JS函数库,封装了许多实用的功能,其中最引人入胜的就是Ajax。 jQuery中的Ajax操作,语法简单,操作方便,使Ajax从未如此轻松,前端人员从此不再为与服务器异步交互而发愁,本套课程,精选了最常用的几个方法,从基本的语法到每个参数,再到具体实例进行了全面的讲解。

      AJAX教程14548次播放


    • Git教程(60分钟全程无废话版)

      Git 是一个开源的分布式版本控制系统,用于敏捷高效地处理任何或小或大的项目。 Git 是 Linus Torvalds 为了帮助管理 Linux 内核开发而开发的一个开放源码的版本控制软件。 Git 与常用的版本控制工具 CVS, Subversion 等不同,它采用了分布式版本库的方式,不必服务器端软件支持

      JavaScript教程12547次播放


    1/1