jquery控制元素的隐藏和显示的几种方法。
组织略显凌乱,请耐心看!
使用jquery控制div的显示与隐藏,一句话就能搞定,例如:
1.$("#id").show()表示为display:block,
$("#id").hide()表示为display:none;
2.$("#id").toggle()切换元素的可见状态。如果元素是可见的,切换为隐藏的;如果元素是隐藏的,则切换为可见的。
3.$("#id").css('display','none');//隐藏
$("#id").css('display','block');//显示
或者
$("#id")[0].style.display='none';
display=none 控制对象的隐藏
display=block控制对象的显示
4.$("#id").css('visibility','hidden');//元素隐藏
$("#id").css('visibility','visible');//元素显示
CSS visibility 属性规定元素是否可见。
visible 元素可见。
hidden 元素不可见。
collapse 在表格元素中使用时,此值可删除一行或一列,但它不影响表格的布局。被行或列占据的空间会留给其他内容使用。如果此值被用在其他的元素上,会呈现为 "hidden"。
inherit 从父元素继承 visibility 属性的值。
注意:
display:none和visible:hidden都能把网页上某个元素隐藏起来,在视觉效果上没有区别,但是在一些DOM操作中两者有区别:
display:none ---不为被隐藏的对象保留其物理空间,即该对象在页面上彻底消失,通俗来说就是看不见也摸不到。
visible:hidden--- 使对象在网页上不可见,但该对象在网页上所占的空间没有改变,即它仍然具有高度、宽度等属性,通俗来说就是看不见但摸得到。
//第1种方法 ,给元素设置style属性
$("#hidediv").css("display", "block");
//第2种方法 ,给元素换class,来实现隐藏div,前提是换的class样式定义好了隐藏属性
$("#hidediv").attr("class", "blockclass");
//第3种方法,通过jquery的css方法,设置div隐藏
$("#blockdiv").css("display", "none"); $("#hidediv").show();//显示div
$("#blockdiv").hide();//隐藏div
jquery控制元素的隐藏和显示的几种方法。的更多相关文章
- 如何使用T-SQL备份还原数据库及c#如何调用执行? C#中索引器的作用和实现。 jquery控制元素的隐藏和显示的几种方法。 localStorage、sessionStorage用法总结 在AspNetCore中扩展Log系列 - 介绍开源类库的使用(一) span<T>之高性能字符串操作实测
如何使用T-SQL备份还原数据库及c#如何调用执行? 准备材料:Microsoft SQL Server一部.需要还原的bak文件一只 一.备份 数据库备份语句:user master backup ...
- jquery控制元素的隐藏和显示的几种方法
使用jquery控制div的显示与隐藏,一句话就能搞定,例如: 方法一 显示: $("#id").show()表示为display:block, 隐藏: $("#id&q ...
- js设置控件的隐藏与显示的两种方法
js设置控件的隐藏与显示,设置控件style的display和visibility属性就可以了,下面有个示例,需要的朋友可以参考下用JavaScript隐藏控件的方法有两种,分别是通过设置控件的sty ...
- jQuery控制元素显示、隐藏、切换、滑动的方法
jQuery 隐藏和显示 通过 hide() 和 show() 两个函数,jQuery 支持对 HTML 元素的隐藏和显示: 实例 $("#hide").click(functio ...
- js 原生: 身份证脱敏、唯一随机字符串uuid、对于高 index 元素的隐藏与显示
1. 对于高 index 元素的隐藏 与 显示 export const hideIndexEle = (cssStr)=>{ const player = getElementsByCss(c ...
- CSS 小结笔记之元素的隐藏与显示
在网站上经常会有一些需要一定操作才会显示或隐藏的元素,这时会用到元素的隐藏与显示.主要通过以下三种属性实现. 1.display :none|block |inline |inline-block d ...
- AE控制图层中要素可见状态的几种方法
转自原文 AE控制图层中要素可见状态的几种方法 工作中常有这样的需求,一个作业图层由几个作业员来操作,我们要 控制每一个作业员只能看到他负责的区域.作业员的可见区域控制有时候是按空间区域划分,有时候是 ...
- jQuery控制元素隐藏和显示
1.jQuery隐藏和显示效果 通过 jQuery,您可以使用 hide() 和 show() 方法来隐藏和显示 HTML 元素: $("#hide").click(functio ...
- jquery控制元素的显示与隐藏
比如要控制div的显示与隐藏,一句话就搞定了.$("#id").show()表示display:block,$("#id").hide()表示display:n ...
随机推荐
- solr搜索之搜索精度问题我已经尽力了!!!
solr搞了好久了,没啥进展,没啥大的突破,但是我真的尽力了! solr7可能是把默认搜索方式去掉了,如下: 在solr7里找了半天以及各种查资料也没发现这个默认搜索方式,后来想,可能是被edisma ...
- springboot 邮件服务
springboot仍然在狂速发展,才五个多月没有关注,现在看官网已经到1.5.3.RELEASE版本了.准备慢慢在写写springboot相关的文章,本篇文章使用springboot最新版本1.5. ...
- OpenMP 奇偶换排序
▶ 使用 OpenMP 进行奇偶交换排序 ● 代码 #include <stdio.h> #include <stdlib.h> #include <omp.h> ...
- jdk1.6 eclipse kepler 中安装jda
原因这是个比较老的版本的jad 参考:https://www.cnblogs.com/zhikou/p/8098137.html 1.在eclipse的help—>Install New Sof ...
- PowerDesigner 生成的脚本取掉双引号
建模工具PowerDesigner http://www.cnblogs.com/mcgrady/archive/2013/05/25/3098588.html 默认导出在带双引号,表名称后期使用的时 ...
- 基于Spring Boot和Spring Cloud实现微服务架构学习
转载自:http://blog.csdn.net/enweitech/article/details/52582918 看了几周Spring相关框架的书籍和官方demo,是时候开始总结下这中间的学习感 ...
- 如何解决JSP页面显示乱码问题
一.JSP页面显示乱码 下面的显示JSP页面(display.jsp)就出现乱码: <html> <head> <title>JSP的中文处理</title& ...
- 更改Eclipse里的Classpath Variables M2_REPO
M2_REPO这个classpath variable 是不能改变的. 为什么 Eclipse 里的 Classpath Variables M2_REPO 无法修改(non modifiable) ...
- java编写binder服务实例
文件目录结果如下: 一. 编写AIDL文件 IHelloService.aidl: /** {@hide} */ interface IHelloService { void sayhello(); ...
- 54. Spiral Matrix (Graph)
Given a matrix of m x n elements (m rows, n columns), return all elements of the matrix in spiral or ...