jQuery: eq () против get () - PullRequest
Новая
       5

jQuery: eq () против get ()

95 голосов
/ 17 января 2011

Я новичок в jQuery, и мне интересно, в чем разница между функциями jQuery get() и eq().Я могу неправильно понять, что делает функция get(), но мне показалось странным, что я не могу вызвать функцию для возвращенного элемента, возвращенного в той же строке. 

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

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

Ответы [ 8 ]

186 голосов
/ 17 января 2011

.get() и .eq() оба возвращают один "элемент" из массива объектов jQuery, но они возвращают один элемент в разных формах.

.eq() возвращает егокак объект jQuery, то есть элемент DOM помещен в оболочку jQuery, что означает, что он принимает функции jQuery.

.get() возвращает массив необработанных элементов DOM.Вы можете манипулировать каждым из них, обращаясь к его атрибутам и вызывая его функции, как если бы вы работали с необработанным элементом DOM.Но он теряет свою идентичность как объект, завернутый в jQuery, поэтому функция jQuery, такая как .fadeIn, не будет работать.

16 голосов
/ 17 января 2011

get() возвращает элемент DOM, тогда как :eq() и eq() возвращают элемент jQuery. Так как элементы DOM не имеют метода fadeIn(), завершается ошибкой .

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

Описание: Получение элементов DOM, соответствующих объекту jQuery.

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

Описание: Выберите элемент с индексом n в соответствующем наборе.

12 голосов
/ 17 января 2011

get(0) (документы) возвращает первый элемент DOM в наборе.

eq(0) (документы) возвращает первый элемент DOM в наборе, обернутый в объект jQuery.

Вот почему .fadeIn("slow"); не работает, когда вы делаете .get(0).У элемента DOM нет метода fadeIn(), но у объекта jQuery есть.

6 голосов
/ 17 января 2011

Чтобы опираться на другие ответы: 

$('h2').get(0) === $('h2').eq(0)[0]  //true
$( $('h2').get(0) ) === $('h2').eq(0)  //true
5 голосов
/ 17 января 2011

eq(i) извлекает i-й элемент в наборе получателя как объект jQuery, а get(i) возвращает элемент в i-й позиции как элемент DOM.

Причина, по которой это не работает: 

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

Это потому, что элемент DOM h2 не имеет метода с именем fadeIn.

Вы должны использовать здесь eq(0).

0 голосов
/ 30 марта 2017

Ответы выше объяснили конкретно и правильно.Я хочу добавить несколько моментов, которые могут помочь при использовании get().

  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;
0 голосов
/ 10 ноября 2015

Метод jQuery eq () выбирает элемент HTML с определенным индексным номером.

Вот пример этого 

<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.

Источник: http://www.snoopcode.com/JQuery/jquery-eq-selector

0 голосов
/ 11 июня 2013

Я привожу пример, который объясняет пункты, приведенные здесь другими.рассмотрим следующий код 

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

и соответствующий код 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);
    });

Это то, что вы увидите 

 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]

Первым является объект DOM, апоследний является объектом в Jquery, где вы можете вызывать методы Jquery

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...