加载中...

get()


概述   .get( index ) 

返回值:ElementArray

描述:通过jQuery对象获取一个对应的DOM元素。

  • V : 1.0.get( [index ] )

    • index
      类型: Integer
      从0开始计数,用来确定获取哪个元素。

.get() 方法允许我们直接访问jQuery对象中相关的DOM节点。 如果index的值超出范围 - 小于元素数量的负数或等于或大于元素的数量 - 那么它将返回undefined。 假设我们页面上有一个简单的无序列表:

  1. <ul>
  2. <li id="foo">foo</li>
  3. <li id="bar">bar</li>
  4. </ul>

如果指定了 index 参数, .get() 则会获取单个元素:

  1. console.log( $( "li" ).get( 0 ) );

由于索引 index 是以 0 开始计数的,所以上面代码返回了第一个列表项:

<li id="foo">

每个 jQuery 对象也被当成一个数组,所以我们也可以直接用数组的取值运算符来获得列表项:

  1. console.log( $( "li" )[0] );

然而,这种语法缺少某些 .get() 所具有的附加功能,比如可以指定索引值为负值:

  1. console.log( $( "li" ).get(-1) );

负的索引值表示从匹配的集合中从末尾开始倒数,所以上面这个示例将会返回列表中最后一项:

<li id="bar">

示例

实例

给出点中元素的标签名。

  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <style>
  5. span { color:red; }
  6. div { background:yellow; }
  7. </style>
  8. <script src="http://code.jquery.com/jquery-latest.js"></script>
  9. </head>
  10. <body>
  11. <span>&nbsp;</span>
  12. <p>In this paragraph is an <span>important</span> section</p>
  13. <div><input type="text" /></div>
  14. <script>
  15. $("*", document.body).click(function (e) {
  16. e.stopPropagation();
  17. var domEl = $(this).get(0);
  18. $("span:first").text("Clicked on - " + domEl.tagName);
  19. });
  20. </script>
  21. </body>
  22. </html>

运行一下


概述   .get() 

返回值: Array

描述:通过检索匹配jQuery对象得到对应的DOM元素。

  • V : 1.0.get()

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

假设我们页面上有一个简单的无序列表:

  1. <ul>
  2. <li id="foo">foo</li>
  3. <li id="bar">bar</li>
  4. </ul>

如果不带参数, .get() 会返回所有的元素:

  1. console.log( $( "li" ).get() );

调用这个方法将会返回所有匹配的DOM节点,这些节点包含在一个标准的数组中:

[<li id="foo">, <li id="bar">]

示例

实例

选择文档中的所有div,并且作为一个数组返回。然后使用浏览器原生的 reverse 方法将数组翻转。

  1. <!doctype html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="utf-8">
  5. <title>get demo</title>
  6. <style>
  7. span { color:red; }
  8. </style>
  9. <script src="http://code.jquery.com/jquery-1.9.1.js"></script>
  10. </head>
  11. <body>
  12. Reversed - <span></span>
  13. <div>One</div>
  14. <div>Two</div>
  15. <div>Three</div>
  16. <script>
  17. function disp(divs) {
  18. var a = [];
  19. for ( var i = 0; i < divs.length; i++) {
  20. a.push( divs[i].innerHTML );
  21. }
  22. $( "span" ).text( a.join(" ") );
  23. }
  24. disp( $( "div" ).get().reverse() );
  25. </script>
  26. </body>
  27. </html>

运行一下


还没有评论.