程序博客网 > linux 监控java堆内存

jQuery 学习九(筛选)

来源：互联网 发布：linux 监控java堆内存 编辑：程序博客网 时间：2024/04/29 11:42
    ●  eq(index) 
Javascript代码  收藏代码
  1. /** 
  2.  * 获取第 N 个元素。 
  3.  * 
  4.  * @index(Integer) 元素在 jQuery 对象中的索引 
  5.  * @return Object 
  6.  * @owner jQuery Object 
  7.  */  
  8. function eq(index);  
  9.   
  10. // 例子：获取匹配的第二个元素。  
  11. <p> This is just a test.</p>  
  12. <p> So is this</p>  
  13.   
  14. $("p").eq(1) ->  [ <p> So is this</p> ]  


    ●  filter(expr) 
Javascript代码  收藏代码
  1. /** 
  2.  * 筛选出与指定表达式匹配的元素集合。 
  3.  * 这个方法用于缩小匹配的范围。用逗号分隔多个表达式。 
  4.  * 
  5.  * @expr(Expression) 过滤表达式 
  6.  * @return Object 
  7.  * @owner jQuery Object 
  8.  */  
  9. function filter(expr);  
  10.   
  11. // 例子一：保留带有 select 类的元素。  
  12. <p>Hello</p>  
  13. <p>Hello Again</p>  
  14. <p class="selected">And Again</p>  
  15. <p> So is this</p>  
  16.   
  17. $("p").filter(".selected") ->  [ <p class="selected">And Again</p> ]  
  18.   
  19. // 例子二：保留第一个以及带有 select 类的元素。  
  20. <p>Hello</p>  
  21. <p>Hello Again</p>  
  22. <p class="selected">And Again</p>  
  23.   
  24. $("p").filter(".selected, :first") -> [ <p>Hello</p>, <p class="selected">And Again</p> ]  


    ●  filter(fn) 
Javascript代码  收藏代码
  1. /** 
  2.  * 筛选出与指定函数返回值匹配的元素集合。 
  3.  * 这个函数内部将对每个对象计算一次(正如 "$.each")。 
  4.  * 如果调用的函数返回 false 则这个元素被删除，否则就会保留。 
  5.  * 
  6.  * @fn(Function) 传递进 filter 的函数 
  7.  * @return Object 
  8.  * @owner jQuery Object 
  9.  */  
  10. function filter(fn);  
  11.   
  12. // 例子：保留子元素中不含有 ol 的元素。  
  13. <p>  
  14.   <ol>  
  15.     <li>Hello</li>  
  16.   </ol>  
  17. </p>  
  18. <p>How are you?</p>   
  19.   
  20. $("p").filter(function(index) {  
  21.   return $("ol", this).length == 0;  
  22. });  ->  [ <p>How are you?</p> ]  


    ●  hasClass(class) 
Javascript代码  收藏代码
  1. /** 
  2.  * 检查当前的元素是否含有某个特定的类，如果有，则返回 true。 
  3.  * 这其实就是 is("." + class)。 
  4.  * 
  5.  * @class(String) 用于匹配的类名 
  6.  * @return boolean 
  7.  * @owner jQuery Object 
  8.  */  
  9. function hasClass(class);  
  10.   
  11. // 例子：给包含有某个类的元素进行一个动画。  
  12. <div class="protected"></div>  
  13. <div></div>  
  14.   
  15. $("div").click(function() {  
  16.   if ( $(this).hasClass("protected") )  
  17.     $(this)  
  18.       .animate({ left: -10 })  
  19.       .animate({ left: 10 })  
  20.       .animate({ left: -10 })  
  21.       .animate({ left: 10 })  
  22.       .animate({ left: 0 });  
  23. });  


    ●  is(expr) 
Javascript代码  收藏代码
  1. /** 
  2.  * 用一个表达式来检查当前选择的元素集合，如果其中至少有一个元素符合这个给定的表达式就返回 true。 
  3.  * 如果没有元素符合，或者表达式无效，都返回 false。filter 内部实际也是在调用这个函数，所以，filter() 
  4.  * 函数原有的规则在这里也适用。 
  5.  * 
  6.  * @expr(String) 用于筛选的表达式 
  7.  * @return boolean 
  8.  * @owner jQuery Object 
  9.  */  
  10. function is(expr);  
  11.   
  12. // 例子：由于 input 元素的父元素是一个表单元素，所以返回 true。  
  13. <form>  
  14.   <input type="checkbox" />  
  15. </form>  
  16.   
  17. $("input[type='checkbox']").parent().is("form") = true  


    ●  map(callback) 
Javascript代码  收藏代码
  1. /** 
  2.  * 将一组元素转换成其他数组(不论是否是元素数组)。 
  3.  * 你可以用这个函数来建立一个列表，不论是值、属性还是 CSS 样式，或者其他特别形式。这都可以用 
  4.  * $.map() 来方便的建立。 
  5.  * 
  6.  * @callback(Function) 给每个元素执行的函数 
  7.  * @return jQuery Object 
  8.  * @owner jQuery Object 
  9.  */  
  10. function map(callback);  
  11.   
  12. // 例子：把 form 中的每个 input 元素的值建立一个列表。  
  13. <form>  
  14.   <input type="text" name="name" value="John"/>  
  15.   <input type="text" name="password" value="password"/>  
  16.   <input type="text" name="url" value="http://ejohn.org/"/>  
  17. </form>  
  18.   
  19. /** 
  20.  * callback 里的 this 代表的是 DOM 元素，$(this) 则把 DOM 对象转换为 jQuery 对象。 
  21.  * map 函数返回的是 jQuery Object 
  22.  */  
  23. var result = $(function() {  
  24.   $("input").map(function() {  
  25.     return $(this).val();  
  26.   });  
  27. }); ->   
  28. result[0] = "John"  
  29. result[1] = "password"  
  30. result[2] = "http://ejohn.org/"  


    ●  not(expr) 
Javascript代码  收藏代码
  1. /** 
  2.  * 删除与指定表达式匹配的元素。 
  3.  * 
  4.  * @expr(String, DOMElement, Array<DOMElement>) 一个表达式、一个元素或者一组元素 
  5.  * @return jQuery Object 
  6.  * @owner jQuery Object 
  7.  */  
  8. function not(expr);  
  9.   
  10. // 例子：从 p 元素中删除 id 为 "selected" 的元素。  
  11. <p>Hello</p>  
  12. <p id="selected">Hello Again</p>  
  13.   
  14. $("p").not( $("#selected")[0] ) -> [ <p>Hello</p> ]  


    ●  slice(start, [end]) 
Javascript代码  收藏代码
  1. /** 
  2.  * 选取一个匹配的子集。 
  3.  * 
  4.  * @start(Integer) 开始选取子集的位置。第一个元素是 0.如果是负数，则可以从集合的尾部开始选起。 
  5.  * @end(Integer) (可选) 结束选取自己的位置，如果不指定，则就是本身的结尾。 
  6.  * @return jQuery Object 
  7.  * @owner jQuery Object 
  8.  */  
  9. function slice(start, [end]);  
  10.   
  11. // 例子一：选择第一个 p 元素。  
  12. <p>Hello</p>  
  13. <p>cruel</p>  
  14. <p>World</p>  
  15.   
  16. $("p").slice(0, 1).wrapInner("<b></b>") -> [ <p><b>Hello</b></p> ]  
  17.   
  18. // 例子二：选择前两个 p 元素。  
  19. <p>Hello</p>  
  20. <p>cruel</p>  
  21. <p>World</p>  
  22.   
  23. $("p").slice(0, 2).wrapInner("<b></b>") -> [ <p><b>Hello</b></p>,<p><b>cruel</b></p> ]  
  24.   
  25. // 例子三：只选取第二个 p 元素。  
  26. <p>Hello</p>  
  27. <p>cruel</p>  
  28. <p>World</p>  
  29.   
  30. $("p").slice(1, 2).wrapInner("<b></b>") -> [ <p><b>cruel</b></p> ]  
  31.   
  32. // 例子四：只选取第二和第三个 p 元素。  
  33. <p>Hello</p>  
  34. <p>cruel</p>  
  35. <p>World</p>  
  36.   
  37. $("p").slice(1).wrapInner("<b></b>") -> [ <p><b>cruel</b></p>, <p><b>World</b></p> ]  
  38.   
  39. // 例子五：选取第最后一个 p 元素。  
  40. <p>Hello</p>  
  41. <p>cruel</p>  
  42. <p>World</p>  
  43.   
  44. $("p").slice(-1).wrapInner("<b></b>") -> [ <p><b>World</b></p> ]  


    ●  add(expr) 
Javascript代码  收藏代码
  1. /** 
  2.  * 把与表达式匹配的元素添加到 jQuery 对象中。这个函数可以用于连接分别与两个表达式匹配的元素结果集。 
  3.  * 
  4.  * @expr(String, DOMElement, Array<DOMElement>) 用于匹配元素并添加的表达式字符串，或者用于动态生成 
  5.  *                                              的 HTML 代码，如果是一个字符串数组则返回多个元素 
  6.  * @return jQuery Object 
  7.  * @owner jQuery Object 
  8.  */  
  9. function add(expr);  
  10.   
  11. // 例子一：添加一个新元素到一组匹配的元素中，并且这个新元素能匹配给定的表达式。  
  12. <p>Hello</p>  
  13. <span>Hello Again</span>  
  14.   
  15. $("p").add("span") -> [ <p>Hello</p>, <span>Hello Again</span> ]  
  16.   
  17. // 例子二：动态生成一个元素并添加至匹配的元素中。  
  18. <p>Hello</p>  
  19.   
  20. $("p").add("<span>Again</span>") -> [ <p>Hello</p>, <span>Hello Again</span> ]  
  21.   
  22. // 例子三：为匹配的元素添加一个或者多个元素。  
  23. <p>Hello</p>  
  24. <p><span id="a">Hello Again</span></p>  
  25.   
  26. $("p").add(document.getElementById("a")) ->   
  27. [ <p>Hello</p>, <p><span id="a">Hello Again</span></p>, <span id="a">Hello Again</span> ]  


    ●  children([expr]) 
Javascript代码  收藏代码
  1. /** 
  2.  * 取得一个包含匹配的元素集合中每一个元素的所有子元素的元素集合。可以通过可选的表达式来过滤所匹配的 
  3.  * 子元素。注意：parents() 将查找所有祖辈元素，而 children() 只考虑子元素而不考虑所有后代元素。 
  4.  * 
  5.  * @expr(String) (可选) 用以过滤子元素的表达式 
  6.  * @return jQuery Object 
  7.  * @owner jQuery Object 
  8.  */  
  9. function children([expr]);  
  10.   
  11. // 例子一：查找 DIV 中的每个子元素。  
  12. <p>Hello</p>  
  13. <div><span>Hello Again</span></div>  
  14. <p>And Again</p>  
  15.   
  16. $("div").children() -> [ <span>Hello Again</span> ]  
  17.   
  18. // 例子二：在每个 div 中查找 .selected 的类。  
  19. <div>  
  20.   <span>Hello</span>  
  21.   <p class="selected">Hello Again</p>  
  22.   <p>And Again</p>  
  23. </div>  
  24.   
  25. $("div").children(".selected") ->  <p class="selected">Hello Again</p> ]  


    ●  contents() 
Javascript代码  收藏代码
  1. /** 
  2.  * 查找匹配元素内部所有的子节点(包括文本节点)。如果元素是一个 iframe，则查找文档内容。 
  3.  * 
  4.  * @return jQuery Object 
  5.  * @owner jQuery Object 
  6.  */  
  7. function contents();  
  8.   
  9. // 例子一：查找所有文本节点并加粗。  
  10. <p>Hello <a href="http://ejohn.org/">John</a>, how are you doing?</p>  
  11.   
  12. $("p").contents().not("[nodeType=1]").wrap("<b/>") ->   
  13. <p><b>Hello</b> <a href="http://ejohn.org/">John</a>, <b>how are you doing?</b></p>  
  14.   
  15. // 例子二：往一个空框架中加些内容。  
  16. <iframe src="/index-blank.html" width="300" height="100"></iframe>  
  17.   
  18. $("iframe").contents().find("body").append("I'm in an iframe!")  


    ●  find(expr) 
Javascript代码  收藏代码
  1. /** 
  2.  * 搜索所有与指定表达式匹配的元素。这个函数是找出正在处理的元素的后代元素的好方法。 
  3.  * 所有搜索都依靠 jQuery 表达式来完成。这个表达式可以使用 CSS1-3 的选择器语法来写。 
  4.  * 
  5.  * @expr(String) 用于查找的表达式 
  6.  * @return jQuery Object 
  7.  * @owner jQuery Object 
  8.  */  
  9. function find(expr);  
  10.   
  11. // 例子：从所有的段落开始，进一步搜索下面的 span 元素。与 $("p span") 相同。  
  12. <p><span>Hello</span>, how are you?</p>  
  13.   
  14. $("p").find("span") -> [ <span>Hello</span> ]  


    ●  next([expr]) 
Javascript代码  收藏代码
  1. /** 
  2.  * 取得一个包含匹配的元素集合中每一个元素紧邻的后面同辈元素的元素集合。 
  3.  * 这个函数只返回后面那个紧邻的同辈元素，而不是后面所有的同辈元素(可以使用nextAll)。 
  4.  * 可以用一个可选的表达式进行筛选。 
  5.  * 
  6.  * @expr(String) (可选) 用于筛选的表达式 
  7.  * @return jQuery Object 
  8.  * @owner jQuery Object 
  9.  */  
  10. function next([expr]);  
  11.   
  12. // 例子一：找到每个段落的后面紧邻的同辈元素。  
  13. <p>Hello</p>  
  14. <p>Hello Again</p>  
  15. <div><span>And Again</span></div>  
  16.   
  17. $("p").next() -> [ <p>Hello Again</p>, <div><span>And Again</span></div> ]  
  18.   
  19. // 例子二：找到每个段落的后面紧邻的同辈元素中类名为 selected 的元素。  
  20. <p>Hello</p>  
  21. <p class="selected">Hello Again</p>  
  22. <div><span>And Again</span></div>  
  23.   
  24. $("p").next(".selected") -> [ <p class="selected">Hello Again</p> ]  


    ●  nextAll([expr]) 
Javascript代码  收藏代码
  1. /** 
  2.  * 查找当前元素之后所有的同辈元素。可以用表达式进行过滤。 
  3.  * 
  4.  * @expr(String) (可选) 用于筛选的表达式 
  5.  * @return jQuery Object 
  6.  * @owner jQuery Object 
  7.  */  
  8. function nextAll([expr]);  
  9.   
  10. // 例子：给第一个div之后的所有元素加个类。  
  11. <div></div>  
  12. <div></div>  
  13. <div></div>  
  14. <div></div>  
  15.   
  16. $("div:first").nextAll().addClass("after") ->   
  17.     [ <div class="after"></div>, <div class="after"></div>, <div class="after"></div> ]  


    ●  parent([expr]) 
Javascript代码  收藏代码
  1. /** 
  2.  * 取得一个包含着所有匹配元素的唯一父元素的元素集合。你可以使用可选的表达式来筛选。 
  3.  * 
  4.  * @expr(String) (可选) 用于筛选的表达式 
  5.  * @return jQuery Object 
  6.  * @owner jQuery Object 
  7.  */  
  8. function parent([expr]);  
  9.   
  10. // 例子一：查找每个段落的父元素。  
  11. <div>  
  12.   <p>Hello</p>  
  13.   <p>Hello</p>  
  14. </div>  
  15.   
  16. $("p").parent() -> [ <div><p>Hello</p><p>Hello</p></div>]  
  17.   
  18. // 例子二：查找段落的父元素中每个类名为 selected 的父元素。  
  19. <div>  
  20.   <p>Hello</p>  
  21. </div>  
  22. <div class="selected">  
  23.   <p>Hello Again</p>  
  24. </div>  
  25.   
  26. $("p").parent(".selected") -> [ <div class="selected"><p>Hello Again</p></div> ]  


    ●  parents([expr]) 
Javascript代码  收藏代码
  1. /** 
  2.  * 取得一个包含着所有匹配元素的祖先元素的元素集合。可以通过一个可选的表达式进行筛选。 
  3.  * 
  4.  * @expr(String) (可选) 用于筛选祖先元素的表达式 
  5.  * @return jQuery Object 
  6.  * @owner jQuery Object 
  7.  */  
  8. function parents([expr]);  
  9.   
  10. // 例子一：找到每个 span 元素的所有祖先元素。  
  11. <html>  
  12.   <body>  
  13.     <div>  
  14.       <p>  
  15.         <span>Hello</span>  
  16.       </p>  
  17.       <span>Hello Again</span>  
  18.     </div>  
  19.   </body>  
  20. </html>  
  21.   
  22. $("span").parents()  
  23.   
  24. // 例子二：找到每个 span 的所有是 p 元素的祖先元素。  
  25. <html>  
  26.   <body>  
  27.     <div>  
  28.       <p>  
  29.         <span>Hello</span>  
  30.       </p>  
  31.       <span>Hello Again</span>  
  32.     </div>  
  33.   </body>  
  34. </html>  
  35.   
  36. $("span").parents("p")  


    ●  prev([expr]) 
Javascript代码  收藏代码
  1. /** 
  2.  * 取得一个包含匹配的元素集合中每一个元素紧邻的前一个同辈元素的元素集合。 
  3.  * 可以用一个可选的表达式进行筛选。只有紧邻的同辈元素会被匹配到，而不是前面所有的同辈元素。 
  4.  * 
  5.  * @expr(String) (可选) 用于筛选前一个同辈元素的表达式 
  6.  * @return jQuery Object 
  7.  * @owner jQuery Object 
  8.  */  
  9. function prev([expr]);  
  10.   
  11. // 例子一：找到每个段落紧邻的前一个同辈元素。  
  12. <p>Hello</p>  
  13. <div>  
  14.   <span>Hello Again</span>  
  15. </div>  
  16. <p>And Again</p>  
  17.   
  18. $("p").prev() -> [ <div><span>Hello Again</span></div> ]  
  19.   
  20. // 例子二：找到每个段落紧邻的前一个同辈元素中类名为 selected 的元素，  
  21. <div>  
  22.   <span>Hello</span>、  
  23. </div>  
  24. <p class="selected">Hello Again</p>  
  25. <p>And Again</p>  
  26.   
  27. $("p").prev(".selected") -> [ <p class="selected">Hello Again</p> ]  


    ●  prevAll([expr]) 
Javascript代码  收藏代码
  1. /** 
  2.  * 查找当前元素之前所有的同辈元素，可以用表达式渐进行过滤。 
  3.  * 
  4.  * @expr(String) (可选) 用于过滤的表达式 
  5.  * @return jQuery Object 
  6.  * @owner jQuery Object 
  7.  */  
  8. function prevAll([expr]);  
  9.   
  10. // 例子：给最后一个之前的所有 div 加上一个类。  
  11. <div></div>  
  12. <div></div>  
  13. <div></div>  
  14. <div></div>  
  15.   
  16. $("div:last").prevAll().addClass("before") ->   
  17.     [ <div class="before"></div>, <div class="before"></div>, <div class="before"></div> ]  


    ●  siblings([expr]) 
Javascript代码  收藏代码
  1. /** 
  2.  * 取得一个包含匹配的元素集合中每一个元素的所有唯一同辈元素的元素集合。可以用可选的表达式进行筛选。 
  3.  * 
  4.  * @expr(String) (可选) 用于筛选同辈元素的表达式 
  5.  * @return jQuery Object 
  6.  * @owner jQuery Object 
  7.  */  
  8. function siblings([expr]);  
  9.   
  10. // 例子一：找到每个 div 的所有同辈元素。  
  11. <p>Hello</p>  
  12. <div>  
  13.   <span>Hello Again</span>  
  14. </div>  
  15. <p>And Again</p>  
  16.   
  17. $("div").siblings() -> [ <p>Hello</p>, <p>And Again</p> ]  
  18.   
  19. // 例子二：找到每个 div 的所有同辈元素中带有类名为 selected 的元素。  
  20. <div>  
  21.   <span>Hello</span>  
  22. </div>  
  23. <p class="selected">Hello Again</p>  
  24. <p>And Again</p>  
  25.   
  26. $("div").siblings(".selected") -> [ <p class="selected">Hello Again</p> ]  


    ●  andSelf() 
Javascript代码  收藏代码
  1. /** 
  2.  * 加入先前所选的加入当前元素中。对于筛选或查找后的元素，要加入先前所选元素时将会很有用。 
  3.  * 
  4.  * @return jQuery Object 
  5.  * @owner jQuery Object 
  6.  */  
  7. function andSelf();  
  8.   
  9. // 例子：选取所有 div 以及内部的 p，并加上 border 类。  
  10. <div>  
  11.   <p>First Paragraph</p>  
  12.   <p>Second Paragraph</p>  
  13. </div>  
  14.   
  15. $("div").find("p").andSelf().addClass("border") ->   
  16. <div class="border"><p class="border">First Paragraph</p><p class="border">Second Paragraph</p></div>  


    ●  end() 
Javascript代码  收藏代码
  1. /** 
  2.  * 回到最近的一个 "破坏性" 操作之前。即，将匹配的元素列表变为前一次的状态。 
  3.  * 如果之前没有破坏性操作，则返回一个空集。所谓的 "破坏性" 就是指任何改变所匹配的 jQuery 元素的操作。 
  4.  * 这包括在 Traversing 中任何返回一个 jQuery 对象的函数： 
  5.  * 'add', 'andSelf', 'children', 'filter', 'find', 'map', 'next', 'nextAll', 'not',  
  6.  * 'parent', 'parents', 'prev', 'prevAll', 'siblings' and 'slice'。 
  7.  * 另外再加上 Manipulation 中的 'clone'。 
  8.  * 
  9.  * @return jQuery Object 
  10.  * @owner jQuery Object 
  11.  */  
  12. function end();  
  13.   
  14. // 选取所有的 p 元素，查找并选取 span 子元素，然后再回过来选取 p 元素。  
  15. <p>  
  16.   <span>Hello</span>,how are you?  
  17. </p>  
  18.   
  19. $("p").find("span").end() -> [ <p><span>Hello</span> how are you?</p> ]  
linux 监控java堆内存 linux 监控java堆内存
原创粉丝点击
热门IT博客
实况足球巅峰数据实况足球巅峰数据
golang 毫秒时间戳golang 毫秒时间戳
java struct原理
扬州淘宝美工培训学校
怎么让淘宝号快速升3心
网络黑侠哪本作品好
泰国娱乐圈乱吗 知乎
51返利网 淘宝
时间旅行者 知乎
linux wget 批量下载
用友重装后数据恢复
卷睫盼 知乎
二叉树的结点算法
淘宝下架时间显示插件
数控编程人员
银行到期客户数据分析
单片机防盗报警系统
不同编程语言 做什么
咨询公司数据分析
什么是淘宝体的语句
热门问题 老师的惩罚 人脸识别 我在镇武司摸鱼那些年 重生之率土为王 我在大康的咸鱼生活 盘龙之生命进化 天生仙种 凡人之先天五行 春回大明朝 姑娘不必设防，我是瞎子 晶采世纪大厦 日月晶采眼影 日月晶采粉底霜 倩碧晶采嫩白精华露 日月晶采眼影画法 自然堂雪润皙白晶采乳液 魔卡幻想晶钻充值 海蓝之谜晶钻去角质霜 依视路钻晶a3 晶钻博华 立钻牌铁皮枫斗晶 娃哈哈晶钻水 晶钻 晶锐polo 晶锐斯柯达 晶锐报价 斯科达晶锐 晶锐装饰 团购晶锐 晶锐论坛 晶锐怎么样 晶锐70 大众晶锐 晶锐图片 晶锐 斯柯达 晶锐新款 晶锐 报价 赛欧 晶锐 晶锐两厢车 斯柯达 晶锐 大众 晶锐 晶锐降价 小晶锐 mg3和晶锐 新一代晶锐 晶锐 价格 晶锐车报价 两厢晶锐 江淮晶锐 汽车晶锐 斯柯达-晶锐

程序博客网，程序员的互联网技术博客家园。csdn论坛精品 msdn技术资料都在这里