利用来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. 挂载iscsi存储

    参考连接:https://segmentfault.com/a/1190000005853387?utm_source=tag-newest 安装客户端工具,iscsi-initiator yum i ...

  2. 使用Charles请求跳转可作为线上和线下环境的切换

    举个例子: 1.后端拿测试环境的客户端调试本地的代码 2.连接后端本地服务测试客户端和后端的交互 这样就可以改变客户端请求的测试环境换成其他的环境 一.配置 tools--Map remot... 这 ...

  3. 10分钟简单学习net core集成jwt权限认证,快速接入项目落地使用

    什么是JWT JSON Web Token(JWT)是目前最流行的跨域身份验证.分布式登录.单点登录等解决方案. JWT的官网地址:https://jwt.io/ 通俗地来讲,JWT是能代表用户身份的 ...

  4. es date_histogram强制补零

    es补零 GET /cars/transactions/_search { "size" : 0, "aggs": { "sales": { ...

  5. hover 背后的数学和图形学

    前端开发中,hover是最常见的鼠标操作行为之一,用起来也很方便,CSS直接提供:hover伪类,js可以通过mouseover+mouseout事件模拟,甚至一些第三方库/框架直接提供了 hover ...

  6. dos的基本命令

    打开cmd的方式 开始+系统+命令提示符 Win键+R 输入cmd打开控制台(推荐使用) 在任意的文件夹下面,按住shift键+鼠标右键点击,在此处打开命令行窗口 资源管理器的地址栏前面加上cmd + ...

  7. centos7.1使用kubeadm部署kubernetes 1.16.2的master高可用

    机器列表,配置域名解析 cat /etc/hosts192.168.200.210 k8s-master1192.168.200.211 k8s-master2192.168.200.212 k8s- ...

  8. 修改eclipse中注释字体而不影响代码字体

    eclipse的注释字体大小如何修改?不改变代码的字体 貌似没有直接的办法,但是可以取个巧: Window --> Preferences --> General --> Appea ...

  9. [luogu7740]机器人游戏

    考虑容斥,令$f(S)$为要求$\forall p\in S,p$可以作为起点的方案数,答案即$\sum_{S\subseteq[0,n)}(-1)^{|S|}f(S)$ 关于计算$f(S)$,对于第 ...

  10. [loj3180]天桥

    考虑将所有交点作为关键点来建图跑最短路,但图上的关键点数量最坏为$o(nm)$,需要优化 当$s=0$且$g=n-1$的部分分,有以下结论: 1.对于一段天桥$([l,r],y)$,不会从$(r,y) ...