w3cschool案例：

<!DOCTYPE html>

<html>

<body>

<p id="p1">这是一段文本。</p>

<input type="button" value="隐藏文本" onclick="document.getElementById('p1').style.visibility='hidden'" />

<input type="button" value="显示文本" onclick="document.getElementById('p1').style.visibility='visible'" />

</body>

</html>
document.getElementById('p1').style.display=‘none’  也可以使得对象隐藏。但是visibility在隐藏后，对象原先所在的位置并不被清除，style.display=‘none’则清除原对象的位置。

Visibility属性控制元素的显示和隐藏的更多相关文章

  1. css3-10 如何控制元素的显示和隐藏（display和visibility的区别是什么）

    css3-10 如何控制元素的显示和隐藏(display和visibility的区别是什么) 一.总结 一句话总结:使用的时候直接在元素的样式中设置display和visibility属性即可.推荐使 ...

  2. 微信小程序点击控制元素的显示与隐藏

    微信小程序点击控制元素的显示与隐藏 首先我们先来看一下单个点击效果 我们来看一下wxml中的代码: <view class="conten"> <view cla ...

  3. legend3---19、要更多的从服务器端控制元素的显示和隐藏，而不要是页面端

    legend3---19.要更多的从服务器端控制元素的显示和隐藏,而不要是页面端 一.总结 一句话总结: 这样可以控制很多页面端的非法操作 1.html标签中data方式的数据,修改之后在标签上只显示 ...

  4. jquery控制css的display(控制元素的显示与隐藏)

    使用jquery控制div的显示与隐藏: $("#div的id").show()表示display:block, $("#div的id").hide()表示di ...

  5. react中控制元素的显示与隐藏

    1.通过 state 变量来控制是否渲染元素 类似于 vue 的 v-if 方法是通过变量来控制是否加载元素的,如果变量为false,内容就直接不会渲染的. class Demo extends Re ...

  6. jquery控制元素的显示与隐藏

    比如要控制div的显示与隐藏,一句话就搞定了.$("#id").show()表示display:block,$("#id").hide()表示display:n ...

  7. JS控制元素的显示和隐藏

    利用来JS控制页面控件显示和隐藏有两种方法,两种方法分别利用HTML的style中的两个属性,两种方法的不同之处在于控件隐藏后是否还在页面上占空位. 方法一: document.getElementB ...

  8. jQuery判断当前元素显示状态并控制元素的显示与隐藏

    1.jQuery判断一个元素当前状态是显示还是隐藏 $("#id").is(':visible');   //true为显示,false为隐藏 $("#id") ...

  9. 仅使用css实现点击 控制元素的显示与隐藏！

    视频教程:https://www.bilibili.com/video/BV1uE411Q7tx?p=15&spm_id_from=pageDriver 大致方法:在被点击的元素后面 放一个c ...

随机推荐

  1. MySQL中DATETIME、DATE和TIMESTAMP类型的区别

    一.TIMESTAMP 显示格式:YYYY-MM-DD HH:MM:SS 时间范围:[ '1970-01-01 00:00:00'到'2037-12-31 23:59:59'] TIMESTAMP D ...

  2. NLog的使用

    1.项目添加NLog的项目引用: 2.将工程的framework框架改为3.5或4.0,将配置文件[NLog.config]拷贝至运行的bin/(release/debug)路径下 3.项目中代码使用 ...

  3. Oracle 数据库--一个用户同步的sql

    用户同步的sql: insert into crm_customer_user ,username,,,,,id, from sys_user where username not in (selec ...

  4. setInterval（）与clearInterval（）的一个有趣小现象

    今天在使用setInterval()时,发现了一个有意思的事情 代码如下: var box=document.getElementById("box");//获取id为“box”的 ...

  5. android SDK 离线下载更新

    http://blog.csdn.net/harvic880925/article/details/37913801 前言:在公司配置eclipse做android开发,真是烦死了,不知公司做了哪门子 ...

  6. entity framework 新手入门篇（1.5）-lambda表达式与linq

    在建立好了EF模型之后,先不着急使用它,在使用它之前,你还需要了解两个相关的技术,lambda表达式与linq. 作为微软C#语言中重要的语法糖-lambda表达式与LINQ,本质都是一个方法,以la ...

  7. SE1-soc入手又有的东西可以玩了

    笔者之前只有DE2-35 和DE2-70 两个板子用,相比之下亮点主要是:配备了DDR3 的存储器,视频处理能处理更高帧频和画幅数了,此外直接有了USB2.0接口,还配有A9 Arm双核芯片,功能一下 ...

  8. Xml 序列化

    1 XML序列化只能序列化对象的公有属性,并且要求对象有一个无参的构造方法,否者无法反序列化. 2 [Serializable]和[NonSerialized]特性对XML序列化无效!所以使用XML序 ...

  9. JAVA EE的十三种技术

    java ee 的十三中技术 一.jdbc 1). jdbc-odbc桥 2). jdbc-native 驱动桥 3). jdbc-network 桥 4). 纯java驱动 二. java命令和目录 ...

  10. 十分钟了解分布式计算:Google Dataflow

    介绍 Google Cloud Dataflow是一种构建.管理和优化复杂数据处理流水线的方法,集成了许多内部技术,如用于数据高效并行化处理的Flume和具有良好容错机制流处理的MillWheel.D ...