开发者学堂课程【jQuery 开发教程： jQuery_可见性过滤 jQuery 扩展】学习笔记，与课程紧密联系，让用户快速学习知识。
课程地址：https://developer.aliyun.com/learning/course/362/detail/4283
jQuery_可见性过滤 jQuery 扩展
内容介绍
一、jQuery 扩展
二、可见性过滤
一、jQuery扩展
这些选择器是扩展了 css3中的选择器。
因为是css扩展的，而不是css规范的一部分，所以查询中使用无法使性能提升，所以在使用时最好先用 css 选择器选择一部分元素，再使用这些选择器来进行过滤。
举例：新创建一个文件，引入jQuery：
<script src="jquery-2.2.1.min. js">< /script>
写一个表格加上边框和内容并复制几个：
body>
<table border="1">
<tr><td>index0</td></tr>
<tr><td>index1</td></tr>
<tr><td>index2</td></tr>
<tr><td>index3</td></tr>
< /table>
< / body>
这是1×4的表格，现在使用 even 选择器选择所有索引值为偶数的函数添加背景颜色。
要使用这些扩展出来的选择器，首先要使用 css 选择器先来选出一部分元素：
<script>
$ ( function () {
$ ( "table tr: even" ).css ( "background-color" , "red");
})
</script>
1和2已被添加上了颜色，这就是 jQuery扩展出的选择器的用法，其他选择器同理。
二、可见性过滤
1、hidden selector
描述︰选择所有隐藏的元素。
语法:jQuery( ":hidden")
补充∶
元素可以被认为是隐藏的几个情况∶
1)CSs display值是none。
2)是type="hidden"的表单元素。
3)宽度和高度都设置为0。
4)一个祖先元素是隐藏的，因此该元素是不会在页面上显示。
2、visible selector
描述∶选择所有可见的元素。
语法:jQuery( ":visible" )
如果元素占据文档中一定的空间,元素被认为是可见的。可见元素的宽度或高度，是大于零。
所以∶元素的visibility: hidden或opacity:0被认为是可见的，因为仍然占用空间布局。
不在文档中的元素是被认为隐藏的jQuery没有办法知道是否是可见的，因为元素可见性依赖于适用的样式。
隐藏元素上做动画，元素被认为是可见的，直到动画结束。显示元素上做动画，在动画的开始处该元素被认为是可见的。
举例：新创建 hidden.html 文件
引入jQuery：
<script src="jquery-2.2.1.min. js">< /script>
写一个例子：
<body>
<div class="outter">
<div class="inner">hidder ! </div>
< / div>
< / body>
设置样式：
<style>
.outter{
width: 300px;
height: 300px;
background-color: red;
然后写 .inner，设置样式：
.inneri
width: 50px;
height: 50px;
background-color: #abcdef;
< /style>
让其隐藏，写入display：none 这时候就认为是一个隐藏元素。
写 js 检测一下.inneri 是不是隐藏的，如果是隐藏的让其显现出来：
$ (function()i
$( ".outter .inner:hidden" ).css ( "display" , "block");
})
Hider已被显示出来
同理，visible selector 也是一样。