组织略显凌乱,请耐心看!

使用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控制元素的隐藏和显示的几种方法。的更多相关文章

  1. 如何使用T-SQL备份还原数据库及c#如何调用执行? C#中索引器的作用和实现。 jquery控制元素的隐藏和显示的几种方法。 localStorage、sessionStorage用法总结 在AspNetCore中扩展Log系列 - 介绍开源类库的使用(一) span<T>之高性能字符串操作实测

    如何使用T-SQL备份还原数据库及c#如何调用执行? 准备材料:Microsoft SQL Server一部.需要还原的bak文件一只 一.备份 数据库备份语句:user master backup ...

  2. jquery控制元素的隐藏和显示的几种方法

    使用jquery控制div的显示与隐藏,一句话就能搞定,例如: 方法一 显示: $("#id").show()表示为display:block, 隐藏: $("#id&q ...

  3. js设置控件的隐藏与显示的两种方法

    js设置控件的隐藏与显示,设置控件style的display和visibility属性就可以了,下面有个示例,需要的朋友可以参考下用JavaScript隐藏控件的方法有两种,分别是通过设置控件的sty ...

  4. jQuery控制元素显示、隐藏、切换、滑动的方法

    jQuery 隐藏和显示 通过 hide() 和 show() 两个函数,jQuery 支持对 HTML 元素的隐藏和显示: 实例 $("#hide").click(functio ...

  5. js 原生: 身份证脱敏、唯一随机字符串uuid、对于高 index 元素的隐藏与显示

    1. 对于高 index 元素的隐藏 与 显示 export const hideIndexEle = (cssStr)=>{ const player = getElementsByCss(c ...

  6. CSS 小结笔记之元素的隐藏与显示

    在网站上经常会有一些需要一定操作才会显示或隐藏的元素,这时会用到元素的隐藏与显示.主要通过以下三种属性实现. 1.display :none|block |inline |inline-block d ...

  7. AE控制图层中要素可见状态的几种方法

    转自原文 AE控制图层中要素可见状态的几种方法 工作中常有这样的需求,一个作业图层由几个作业员来操作,我们要 控制每一个作业员只能看到他负责的区域.作业员的可见区域控制有时候是按空间区域划分,有时候是 ...

  8. jQuery控制元素隐藏和显示

    1.jQuery隐藏和显示效果 通过 jQuery,您可以使用 hide() 和 show() 方法来隐藏和显示 HTML 元素: $("#hide").click(functio ...

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

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

随机推荐

  1. solr搜索之搜索精度问题我已经尽力了!!!

    solr搞了好久了,没啥进展,没啥大的突破,但是我真的尽力了! solr7可能是把默认搜索方式去掉了,如下: 在solr7里找了半天以及各种查资料也没发现这个默认搜索方式,后来想,可能是被edisma ...

  2. springboot 邮件服务

    springboot仍然在狂速发展,才五个多月没有关注,现在看官网已经到1.5.3.RELEASE版本了.准备慢慢在写写springboot相关的文章,本篇文章使用springboot最新版本1.5. ...

  3. OpenMP 奇偶换排序

    ▶ 使用 OpenMP 进行奇偶交换排序 ● 代码 #include <stdio.h> #include <stdlib.h> #include <omp.h> ...

  4. jdk1.6 eclipse kepler 中安装jda

    原因这是个比较老的版本的jad 参考:https://www.cnblogs.com/zhikou/p/8098137.html 1.在eclipse的help—>Install New Sof ...

  5. PowerDesigner 生成的脚本取掉双引号

    建模工具PowerDesigner http://www.cnblogs.com/mcgrady/archive/2013/05/25/3098588.html 默认导出在带双引号,表名称后期使用的时 ...

  6. 基于Spring Boot和Spring Cloud实现微服务架构学习

    转载自:http://blog.csdn.net/enweitech/article/details/52582918 看了几周Spring相关框架的书籍和官方demo,是时候开始总结下这中间的学习感 ...

  7. 如何解决JSP页面显示乱码问题

    一.JSP页面显示乱码 下面的显示JSP页面(display.jsp)就出现乱码: <html> <head> <title>JSP的中文处理</title& ...

  8. 更改Eclipse里的Classpath Variables M2_REPO

    M2_REPO这个classpath  variable 是不能改变的. 为什么 Eclipse 里的 Classpath Variables M2_REPO 无法修改(non modifiable) ...

  9. java编写binder服务实例

    文件目录结果如下: 一. 编写AIDL文件 IHelloService.aidl: /** {@hide} */ interface IHelloService { void sayhello(); ...

  10. 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 ...