加载中...

andSelf()


概述    .andSelf()过时版本: 1.8, 删除版本: 3.0

返回值:jQuery

描述:添加先前的堆栈元素集合到当前组合。

  • V : 1.2.andSelf()

    • 这个方法不接受任何参数

注意: 此函数已过时,现在是.addBack()的一个别名。在jQuery1.8和更高版本中应使用.addBack()

如上所述在讨论中的.end(), jQuery对象维护一个堆栈内部来跟踪匹配的元素集合的变化。当一个DOM遍历方法被调用时,新的元素集合推入到堆栈中。 如果还需要包含先前的元素集合,.andSelf() 可以提供帮助。

考虑一个页面,一个简单的列表就可以了:

  1. <ul>
  2. <li>list item 1</li>
  3. <li>list item 2</li>
  4. <li class="third-item">list item 3</li>
  5. <li>list item 4</li>
  6. <li>list item 5</li>
  7. </ul>

下面的代码的返回结果是后面的3,4和5列表背景被改变成红色:

  1. $('li.third-item').nextAll().andSelf()
  2. .css('background-color', 'red');

首先,初始选择位于第3项,初始化堆栈集合只包含这项。调用.nextAll() 后将第4和第5项推入堆栈。最后,调用.andSelf() 合并这两个组元素在一起,创建一个jQuery对象,指向所有三个项元素(按照文档中的顺序):{[<li.third-item>,<li>,<li> ]}

示例

.andSelf()方法导致以前遍历堆栈中的DOM元素被添加到当前组。  在第一个示例中,堆栈包含组的结果来自.find("p")。 在第二个示例中,.andSelf()将之前组的元素添加到堆栈中 - 在这种情况下($("div.after-andSelf") - 到当前集合, 选择了两个div和其封闭的段落。

  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <style>
  5. p, div { margin:5px; padding:5px; }
  6. .border { border: 2px solid red; }
  7. .background { background:yellow; }
  8. .left, .right { width: 45%; float: left;}
  9. .right { margin-left:3%; }
  10. </style>
  11. <script src="http://code.jquery.com/jquery-latest.js"></script>
  12. </head>
  13. <body>
  14. <div class="left">
  15. <p><strong>Before <code>andSelf()</code></strong></p>
  16. <div class="before-andself">
  17. <p>First Paragraph</p>
  18. <p>Second Paragraph</p>
  19. </div>
  20. </div>
  21. <div class="right">
  22. <p><strong>After <code>andSelf()</code></strong></p>
  23. <div class="after-andself">
  24. <p>First Paragraph</p>
  25. <p>Second Paragraph</p>
  26. </div>
  27. </div>
  28. <script>
  29. $("div.left, div.right").find("div, div > p").addClass("border");
  30. // First Example
  31. $("div.before-andself").find("p").addClass("background");
  32. // Second Example
  33. $("div.after-andself").find("p").andSelf().addClass("background");
  34. </script>
  35. </body>
  36. </html>

运行一下


还没有评论.