【7】jQuery学习——入门jQuery选择器之过滤选择器-可见性过滤选择器

这篇什么都不说，看标题就知道了，很简单，就2个选择器，嘿嘿

选择器	描述	返回
$("Element:hidden")	选取所有不可见的元素	集合元素
$("Element:visible")	选取所有可见元素	集合元素

这篇很简单吧，就2个，但是我们要知道哪些是可见和不可见的

那我们就来说说不可见有几种情况：

【1】它们的CSS display值是none，<div style="display:none">

【2】它们是type="hidden"的表单元素，<input type=”hidden”>

================================================================

ps.文章参考梦三秋和w3cfuns网站

================================================================

完成了w3cfuns网站的作业

可见性过滤选择器

 1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
 2 <html xmlns="http://www.w3.org/1999/xhtml">
 3 <head>
 4 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
 5 <title>实例</title>
 6 <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
 7 <script type="text/javascript">
 8 $(function(){
 9     $("#but1").click(function(){
10         $("ul:hidden").show(500);
11     });
12     $("#but2").click(function(){
13         $("dl:visible").hide(500);
14     });
15 });
16 </script>
17 <style type="text/css">
18 ul{display:none;}
19 </style>
20 </head>
21 
22 <body>
23 
24 <input type="button" id="but1" value="选择所有不可见的ul元素对象,将其设置为可见" />
25 <input type="button" id="but2" value="选择所有可见的dl元素对象,将其设置为不可见" />
26 
27 <ul>
28     <li>我ul原本不可见现在为可见</li>
29     <li>我ul原本不可见现在为可见</li>
30     <li>我ul原本不可见现在为可见</li>
31     <li>我ul原本不可见现在为可见</li>
32     <li>我ul原本不可见现在为可见</li>
33 </ul>
34 <dl>
35     <dd>我dl是可见的</dd>
36     <dd>我dl是可见的</dd>
37     <dd>我dl是可见的</dd>
38     <dd>我dl是可见的</dd>
39     <dd>我dl是可见的</dd>
40 </dl>
41 
42 </body>
43 </html>