利用来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 Kernel 記憶體管理機制之美<转>

    转自--http://five.rdaili.com/sohu.com.php?u=Mq3EniVnae0axim7jkGhH0IhA9uho6CQso7R1aYomXWJ9UemfwUQYmKRc8 ...

  2. robotframework定位页面内Frame框架里的元素

    在自动化开发中,会遇到在页面内部点开一个新的页面后,新的页面元素无法定位到的情况,如点击下图的上传图片,弹出的界面无法直接定位到: 遇到这种情况需要查看弹出界面是否是Frame框架页面:打开火狐浏览器 ...

  3. JMeter学习笔记--录制脚本(一)

    ---------------------------------------------------------------------------------------------------- ...

  4. @RequestAttribute与@MatrixVariable

    @RequestAttribute 它只能使用在方法入参上,从request请求参数中获取对应的属性值. //路径跳转 @GetMapping("/goto") public St ...

  5. 写给初学者的Linux errno 错误码机制

    不同于Java的异常处理机制, 当你使用C更多的接触到是基于错误码的异常机制, 简单来说就是当调用的函数发生异常时, 程序不会跳转到一个统一处理异常的地方, 取而代之的是返回一个整型错误码. 可能会有 ...

  6. 数据结构知识总结(STL整理)

    重要知识点 1.基础知识 #include<bits/stdc++.h> //万能头文件 #include< algorithm > //包含sort函数 运用sort实现多关 ...

  7. Django笔记&教程 5-2 进阶查询——Queryset

    Django 自学笔记兼学习教程第5章第2节--进阶查询--Queryset 点击查看教程总目录 Queryset相关内容其实蛮多的,本文只介绍一些常用的,详细的推荐查询官方文档:queryset-a ...

  8. MySQL用limit代替SQL Server :top

    mysql 中不支持top,而是用limit代替 若要查询前10条记录,mysql用limit 10 LIMIT可以实现top N查询,也可以实现M至N(某一段)的记录查询,具体语法如下: SELEC ...

  9. [hdu7033]Typing Contest

    为了避免浮点运算,不妨将$f_{i}$​​​乘上$C=10^{2}$​​​,问题即求$\max_{S\subseteq [1,n]}\frac{\sum_{i\in S}(C^{2}-(\sum_{j ...

  10. [loj2863]组合动作

    先用两次猜出第一个字符,后面就不会出现这个字符了 (我们假设这个字符是c0,其余三种字符分别是c1.c2和c3) ,然后考虑已知s的前i个字符(不妨就s),来推出后面的字符 询问:s+c1和s+c2, ...