利用来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. 面试官问我JVM内存结构,我真的是

    面试官:今天来聊聊JVM的内存结构吧? 候选者:嗯,好的 候选者:前几次面试的时候也提到了:class文件会被类加载器装载至JVM中,并且JVM会负责程序「运行时」的「内存管理」 候选者:而JVM的内 ...

  2. char* 和 char[] 的区别

    一.代码 有关下面代码,p和q的区别是什么: int main(int argc, char *argv[]) { char* p = "Hello World"; char q[ ...

  3. 【java+selenium3】模态框处理(五)

    一.模态框的定义: 模态对话框(Modal Dialogue Box , 又叫做模式对话框),是指在用户想要对话框以外的应用程序进行操作时候,必须先对该对话框进行响应.如单击[确定]或者[返回]按钮等 ...

  4. Java oop三大特性(封装,继承,多态)

    封装 顾名思义,就是将数据封装起来,提高数据的安全性.我们程序都是要追求"高内聚,低耦合".高内聚就是类的内部数据操作细节自己完成,不允许外部干涉,低耦合:仅暴露少量的方法给外部使 ...

  5. PTA 6-1 求采用邻接矩阵作为存储结构的无向图各顶点的度 (6分)

    PTA 6-1 求采用邻接矩阵作为存储结构的无向图各顶点的度 (6分) 函数接口定义: 函数接口为: void dgree(MGraph G); G为采用邻接矩阵作为存储结构的有向图 裁判测试程序样例 ...

  6. Are we ready for learned cardinality estimation?

    Are we ready for learned Cardinality Estimation 摘要 文章包括三大部分: 对于一个静态的数据库,本文将五种基于学习的基数估计方法与九中传统的基数估计方法 ...

  7. 从源码分析 XtraBackup 的备份原理

    MySQL物理备份工具,常用的有两个:MySQL Enterprise Backup 和 XtraBackup. 前者常用于MySQL企业版,后者常用于MySQL社区版.Percona Server ...

  8. git修改用户和邮箱

    GIT查看当前用户以及邮箱 $ git config user.name $ git config user.email GIT修改用户以及邮箱 $ git config --global user. ...

  9. [atARC094D]Worst Case

    首先,容易证明满足条件的$ip_{i}$必然是一个前缀 将其看成一张二分图,$i$向满足$ip_{i}<xy$的$p_{i}$连边,即找到一个前缀满足其有完美匹配 二分枚举前缀长度$k$,根据h ...

  10. [bzoj1068]压缩

    用f[i][j][0/1]表示区间[i,j],i之前有没有M的最少需要多少个字符,然后分两种情况:1.可以分为两个,转移到dp[l][mid][0]+1:2.枚举断点,但当前面有M时,后面的这个不能重 ...