jQuery:eq() 与 get()

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/4709660/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-26 17:46:31  来源:igfitidea点击:

jQuery : eq() vs get()

jqueryjquery-selectors

提问by contactmatt

I'm new to jQuery, and I'm wondering what the difference is between jQuery's get()and eq()functions. I may misunderstand what the get()function does, but I thought it odd that I couldn't call a function on the returned on the returned element in the same line.

我是 jQuery 的新手,我想知道 jQueryget()eq()函数之间有什么区别。我可能误解了该get()函数的作用,但我觉得奇怪的是,我无法在同一行中返回元素的返回值上调用函数。

//Doesn't work
I.e.  $("h2").get(0).fadeIn("slow");

//Works
$("h2").eq(0).fadeIn("slow");

回答by Steven

.get()and .eq()both return a single "element" from a jQuery object array, but they return the single element in different forms.

.get()并且.eq()都从 jQuery 对象数组返回单个“元素”,但它们以不同的形式返回单个元素。

.eq()returns it as a jQuery object, meaning the DOM element is wrapped in the jQuery wrapper, which means that it accepts jQuery functions.

.eq()将它作为一个 jQuery 对象返回,这意味着 DOM 元素被包裹在 jQuery 包装器中,这意味着它接受 jQuery 函数。

.get()returns an array of raw DOM elements. You may manipulate each of them by accessing its attributes and invoking its functions as you would on a raw DOM element. But it loses its identity as a jQuery-wrapped object, so a jQuery function like .fadeInwon't work.

.get()返回原始 DOM 元素的数组。您可以通过访问其属性并调用其函数来操作它们中的每一个,就像在原始 DOM 元素上一样。但是它失去了作为 jQuery 包装对象的身份,所以像这样的 jQuery 函数.fadeIn将不起作用。

回答by hunter

get()returns a DOM element whereas :eq()and eq()return a jQuery element. Since DOM elements have no method fadeIn()it fails.

get()返回一个DOM元素,而:eq()eq()返回一个jQuery元素。由于 DOM 元素没有方法,fadeIn()所以它失败了

http://api.jquery.com/get/

http://api.jquery.com/get/

Description:Retrieve the DOM elements matched by the jQuery object.

描述:检索 jQuery 对象匹配的 DOM 元素。

http://api.jquery.com/eq-selector/

http://api.jquery.com/eq-selector/

Description:Select the element at index n within the matched set.

描述:选择匹配集合中索引 n 处的元素。

回答by user113716

get(0)(docs)returns the first DOM element in the set.

get(0)(docs)返回集合中的第一个 DOM 元素。

eq(0)(docs)returns the first DOM element in the set, wrapped in a jQuery object.

eq(0)(docs)返回集合中的第一个 DOM 元素,包裹在一个 jQuery 对象中。

That's why .fadeIn("slow");doesn't work when you do .get(0). A DOM element doesn't have a fadeIn()method, but a jQuery object does.

这就是为什么.fadeIn("slow");当你这样做时不起作用.get(0)。DOM 元素没有fadeIn()方法,但 jQuery 对象有。

回答by qwertymk

To build on the other answers:

以其他答案为基础:

$('h2').get(0) === $('h2').eq(0)[0]  //true
$( $('h2').get(0) ) === $('h2').eq(0)  //true

回答by Jacob Relkin

eq(i)retrieves the ith member in the receiver's set as a jQueryobject, while get(i)returns the member at the ith position as a DOM element.

eq(i)检索接收者集合中的第 i 个成员作为jQuery对象,同时get(i)返回第 i 个位置的成员作为 DOM 元素。

The reason why this doesn't work:

这不起作用的原因:

$("h2").get(0).fadeIn("slow");

Is because the h2DOM element doesn't have a method called fadeIn.

是因为h2DOM 元素没有名为fadeIn.

You should use eq(0)here instead.

你应该eq(0)在这里使用。

回答by brain storm

I am giving an example that explains the points given by others here. consider the following code

我举一个例子来解释其他人在这里给出的观点。考虑以下代码

<div id="example">
    Some text
    <div>Another div</div>
    <!--A comment-->
</div>

and the corresponding js code,

以及对应的js代码,

$(document).ready(function() {
    var div = $("#example").get(0);
    console.log(typeof(div));
    console.log(div);
    console.log("XXXXXXXXX");
    var div_eq=$('#example').eq(0);
    console.log(typeof(div_eq));
    console.log(div_eq);
    });

This is what you will see

这就是你会看到的

 object
excercise1.js (line 5)
<div id="example">
excercise1.js (line 6)
XXXXXXXXX
excercise1.js (line 7)
object
excercise1.js (line 9)
Object[div#example]

The first is a DOM object while the latter is a Jquery-wrapped object where you could call Jquery methods

第一个是 DOM 对象,而后者是 Jquery 包装的对象,您可以在其中调用 Jquery 方法

回答by Prabhakar Undurthi

jQuery eq() method selects a HTML element with a specific index number.

jQuery eq() 方法选择具有特定索引号的 HTML 元素。

Here is an example of that

这是一个例子

<body>
  <div></div>
  <div></div>
  <div></div>
  <div></div>
  <div></div>
</body>

$( "body" ).find( "div" ).eq( 2 ).addClass( "red" );
// it finds the second div in the html body and change it to red color.

Source: http://www.snoopcode.com/JQuery/jquery-eq-selector

来源:http: //www.snoopcode.com/JQuery/jquery-eq-selector

回答by SkuraZZ

Answers above have explained specificly and correctly. I want to add a few points here that might help for the use of get().

上面的回答已经具体正确地解释了。我想在这里添加一些可能有助于使用get().

  1. If you don't pass an argument to .get(), it will return an Array of the DOM elements.

  2. If you got a DOM object using get(), like var s = $("#id").get(0)you can turn it back into jQuery object simply by using this, $(s)

  3. You can use $obj[i]as an alternative way if you don't want to use $obj.get(i), see below,

    var $obj = $("#ul li");
    var obj1 = $obj.get(1);
    var obj2 = $obj[1];
    
    //true
    return obj2===obj1;
    
  1. 如果您不向 传递参数.get(),它将返回一个 DOM 元素数组。

  2. 如果你使用了一个 DOM 对象get(),就像 var s = $("#id").get(0)你可以简单地通过使用它把它变回 jQuery 对象,$(s)

  3. $obj[i]如果您不想使用$obj.get(i),可以作为替代方式使用,见下文,

    var $obj = $("#ul li");
    var obj1 = $obj.get(1);
    var obj2 = $obj[1];
    
    //true
    return obj2===obj1;