1. 定义四种常用隐藏元素的方式，然后调用 jq 的 show 方法显示，观察各原先隐藏元素的 display 表现，结合 jq 源码，show 方法设置 元素 display 属性值为 隐藏时的 display
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
<style>
*{
margin: 0;
padding: 0;
}
ul,li{
border: 1px solid red;
color: red;
}
.hide{
display: none;
}
.inline-block{
display: inline-block;
}
.wrap li:nth-child(4){
display: none;
}
</style>
</head>
<body> <ul class="wrap">
<li style="display: none;">style="display: none;"</li>
<li class="hide">class="hide" + display:list-item;</li>
<li class="hide inline-block">class="hide" + display:inline-block;</li>
<li>display:list-item;</li>
</ul>
<script src="jquery-1.9.1.min.js"></script>
<script>
$('.wrap li').show();
</script>
</body>
</html>
2. 相关文章
3. 扩展 其他隐藏方式 及区别
1 opacity=0，该元素隐藏起来了，但不会改变页面布局，并且，如果该元素已经绑定一些事件，如click事件，那么点击该区域，也能触发点击事件的
2 visibility=hidden，该元素隐藏起来了，但不会改变页面布局，但是不会触发该元素已经绑定的事件
3 display=none，把元素隐藏起来，并且会改变页面布局，可以理解成在页面中把该元素删除掉一样
display: none; 与 jq show方法之间的联系的更多相关文章
-
Android学习笔记之dispatchTouchEvent和OnInterceptTouchEvent和OnTouchEvent三个方法之间的联系...
PS:好久没有写博客了,项目正式开始启动了,但是怎么也打不起精神来...可能还是不适应放假留校...这下一年只能回家一次了...伤感...写篇博客舒坦下... 学习内容: Android中disp ...
-
李洪强iOS开发之OC[018]对象和方法之间的关系
// // main.m // 18 - 对象和方法之间的关系 // // Created by vic fan on 16/7/14. // Copyright © 2016年 李洪强. A ...
-
并查集类的c++封装，比較union_find algorithm四种实现方法之间的性能区别
问题描写叙述: 在计算机科学中,并查集是一种树型的数据结构,其保持着用于处理一些不相交集合(Disjoint Sets)的合并及查询问题.有一个联合-查找算法(union-find algorithm ...
-
jq筛选方法
jq筛选方法(参照手册) 过滤: 1) eq(index|-index):获取第N个元素 负值表示从末尾开始匹配 <!-- 获取匹配的第二个元素 --> <p> This is ...
-
关于让simulink中display组件显示二进制的方法
关于让simulink中display组件显示二进制的方法 1.首先需要配置gateway out模块,勾选propagate data type to output 2.配置display模块 fo ...
-
jquery中使元素显示和隐藏方法之间的区别
在实际的项目开发中,要使一个元素隐藏的方法有很多,比如css的多种属性和jquery的多种方法,虽然他们的作用都是使元素不可见,但是各个方法实现的原理是不一样的.下面主要介绍jquery各个元素隐藏方 ...
-
synchronized修饰的方法之间相互调用
1:synchronized修饰的方法之间相互调用,执行结果为There hello ..因为两个方法(main,hello)的synchronized形成了互斥锁. 所以当main方法执行完之后 ...
-
二.OC基础--1，对象的存储细节,2，#pragma mark指令,3，函数和对象方法的区别,4，对象和方法之间的关系 ,5.课堂习题
1,对象的存储细节, 1. 当创建一个对象的时候:Person *p1 = [Person new],做了三件事情: 1,申请堆内存空间: 2,给实例变量初始化: 3,返回所申请空间的首地址; 2. ...
-
display:none;visibility:hidden;opacity:0;之间的区别
什么是回流 当render tree中的一部分(或全部)因为元素的规模尺寸,布局,隐藏等改变而需要重新构建.这就称为回流(reflow).每个页面至少需要一次回流,就是在页面第一次加载的时候,这时候是 ...
随机推荐
-
Android----消息弹出框
关于Android的知识,自从工作了就没有什么时间去总结学习过的知识,我个人比较喜欢学习后总结,今天就写一下关于android中消息弹出框的几种方式的简单示例,按照自己的思路写了一段,希望对和我一样在 ...
-
手持扫描打印终端POS机应用商场零售批发移动销售开单
无线开单系统,通过此无线开单系统,使用者可以进行日常的盘点.开单等作业.与进销存软件实时对接,可以提供给使用者即时.准确的库存数量.商品价格等信息.手持系统易上手.一次配置即可使用,极大的方便了使用者 ...
-
greenDao 学习之坑 ";java-gen"; 目录下的类不能引用
由于公司最近的项目需要频繁地操作数据库,所以选用greenDao. 网上搜了一 大堆教程,我卡在java工程运行后生成的几个类不能引用了. 看了一下区别,教程的java-gen 目录是蓝色的小框框 , ...
-
Instruments－查看收集到的数据
由于Xcode调试工具Instruments指南篇幅太长,所以本篇blog继续上篇,介绍对Instruments收集到的数据去分析. 关于数据分析 Instruments不解决你代码中的任何问题,它帮 ...
-
微信支付[v3]
原文:微信支付[v3] V2升级V3 顺便记录一下 ,文档: http://pay.weixin.qq.com/wiki/doc/api/index.html !!! 支付授权目录与测试人的微信帐号白 ...
-
Two Sum（两个数的相加）
2017.11.10题目描述:Given nums = [2, 7, 11, 15], target = 9, Because nums[0] + nums[1] = 2 + 7 = 9, retur ...
-
BZOJ 1778: [Usaco2010 Hol]Dotp 驱逐猪猡
1778: [Usaco2010 Hol]Dotp 驱逐猪猡 Time Limit: 10 Sec Memory Limit: 64 MBSubmit: 563 Solved: 216[Submi ...
-
centos下SVN搭建多个库文件总汇
1.checkout时,提示:URL svn://192.168.1.99/svntest doesn't exist...奇怪,怎么会提示库不存在呢?肯定是哪里配置问题.后来尝试了半天,也在网上搜索 ...
-
前端开发 - JavaScript
本节内容 一.如何编写 二.变量 三.数据类型 四.其他 五.语句与异常 六.函数 JavaScript是一门编程语言,浏览器内置了JavaScript语言的解释器,所以在浏览器上按照JavaScri ...
-
使用ASIHTTPRequest xcode编译提示找不到";libxml/HTMLparser.h";
使用ASIHTTPRequest xcode编译提示找不到"libxml/HTMLparser.h",解决方法如下: 1>.在xcode中左边选中项目的root节点,在中间编 ...