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

方法一:

document.getElementById("EleId").style.visibility="hidden";
document.getElementById("EleId").style.visibility="visible";

利用上述方法实现隐藏后,页面的位置还被控件占用,显示空白。

方法二:

document.getElementById("EleId").style.display="none";
document.getElementById("EleId").style.display="inline";

利用上述方法实现隐藏后,页面的位置不被占用。

方法三:
显示元素进行隐藏

document.getElementById("ID名").hidden=ture;

根据页面元素ID名获得页面元素值,进而将其属性设置成隐藏。

将隐藏元素进行显示

对于已经隐藏的页面元素如果要将其再次显示,不是将

document.getElementById("ID名").hidden=false;

而是将其隐藏属性删除

document.getElementById("ID名").removeAttribute("hidden");

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

  1. js控制元素的显示与隐藏

    <body class="easyui-layout"> <div id = "centerId" data-options="re ...

  2. css3-10 如何控制元素的显示和隐藏(display和visibility的区别是什么)

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

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

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

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

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

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

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

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

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

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

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

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

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

  9. js控制div样式显示与隐藏,JS通过点击超链接右边(指定位置)显示一个图标

    原文出自:https://blog.csdn.net/seesun2012 javascript基础篇,老土的方法解决js控制div样式,便于新手理解,粗暴的不能再粗暴,如果你是高手,请忽略! 思路: ...

随机推荐

  1. 『学了就忘』Linux基础命令 — 22、Linux中的硬链接和软链接

    目录 1.文件和目录的基本存储 2.In命令介绍 (1)我们来看看ln命令的基本信息 (2)ln命令的基本格式 3.创建硬链接 (1)如何创建硬链接 (2)硬链接特征 (3)硬连接原理 4.创建软链接 ...

  2. 基于Dapr的 Azure 容器应用

    微软在 Ignite 2021 大会上发布了预览版的Azure Container Apps,这是一个完全托管的无服务器容器运行时间,用于大规模构建和运行现代应用程序.从2021 年 11 月 2 日 ...

  3. java中的泛型设计

    1.为什么要使用泛型程序设计 ArrayList<String> files = new ArrayList<>() 等价于 var files = new ArrayList ...

  4. 如何在SimpleNVR用Excel表格将通道配置简单化

    进入本世纪的第三个十年,流媒体们"绞尽脑汁",依靠技术不断提升用户的体验感.熟悉SimpleNVR的用户都知道,目前SimpleNVR已实现对接自有流媒体服务器平台,不限制观看人数 ...

  5. loadrunner奇怪问题解决:TPS中有Action_Transaction 和 vuser_init_Transaction

    TPS图里多出两条曲线:Action_Transaction 和 vuser_init_Transaction 如下图: 解决方法: Runtime-Settings-Miscellaneous--A ...

  6. 利用DNS缓存和TLS协议将受限SSRF变为通用SSRF

    本文首发于先知社区 前言 这是今年BlackHat上的一个议题:When TLS Hacks You,作者是latacora的Joshua Maddux 议题提出了一个新的ssrf攻击思路,利用DNS ...

  7. virtualenv笔记

    virtualenv venv --python=python2.7 mkvirtualenv venv --python=python linux中使用virtualenvwrapper 安装 pi ...

  8. IDEA Dao层快速跳转Mapper.xml 文件的插件

    1.Idea 窗口→File→Setting→Plugins, 2.搜索 Free MyBatis plugin, install,等待安装完成后,Restart IDEA .

  9. 简单的SQl时间序列生成,每次时间间隔10分钟。

    create table #timeseries(Times datetime not null) go declare @firstdate datetime , @lastdate datetim ...

  10. 菜鸡的Java笔记 第十六 - java 引用传递

    referenceDelivery    引用传递是整个java 的精髓,也是所有初学者最难学的地方        引用的本质:同一块堆内存可以被不同的栈内存所指向    下面通过三道程序来进行引用传 ...