Для заявления, использующего это против JQuery каждый? - PullRequest
2 голосов
/ 29 августа 2011

Я пытаюсь перейти от $.each() к выражению for(), но у меня возникают проблемы с использованием $(this) в более поздней версии?

то есть предполагается, что у меня есть эта функция

$('.class').each(function() {

var myVar = $(this);
var myVarSrc = myVar.attr('src');
...

Проблема, с которой я сталкиваюсь, заключается в том, что, когда я пытаюсь переместить это в for выражение

var class = $('.class');
for (var i = 0; i < class.length; i++) {

var myClass = $('.class')[i];
var myClassSrc = myClass.attr('src');
...

Последнее не связывается с each, что означает myClassSrc - еслитакой же - перепишет?Как я могу использовать оператор for с this?

Ответы [ 3 ]

5 голосов
/ 29 августа 2011

Doing [i] извлекает собственный элемент DOM.

Если вы сделаете это, вы должны получить доступ к свойству .src напрямую.

var cls = $('.class');
for (var i = 0; i < cls.length; i++) {

var myClass = cls[i];
var myClassSrc = myClass.src;

... или используйте метод eq() [документы] , чтобы получить объект jQuery с элементом для заданного индекса:

var cls = $('.class');
for (var i = 0; i < cls.length; i++) {

var myClass = cls.eq(i);
var myClassSrc = myClass.attr('src');

Также обратите внимание, что я удалил $('.class') из цикла. Вам следует использовать кэшированную версию, которую вы сделали до цикла.

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


Основываясь на комментариях ниже, вы столкнулись с очень распространенной проблемой. Поскольку вы назначаете обработчики событий внутри цикла for, а JavaScript не имеет block scope, это означает, что каждый созданный вами обработчик в цикле ссылается на одну и ту же переменную myClassSrc, для которой будет установлено любое значение это было после завершения цикла.

Чтобы создать область видимости переменной, необходимо создать обработчик событий в новой области видимости переменной, которая ссылается на значение в итерации current . Для этого мы просто передаем любое значение, которое мы хотим сохранить, в вызов функции и создаем там обработчик:

function set_up_handler( elem ) {

    var myClassSrc = elem.src; // <-- now this is a local variable referencing
                               //       the "src" of the element passed in.

    elem.addEventListener( 'click', function() {
        alert( myClassSrc );  // <-- this will reference the local "myClassSrc"
    }, false );

}

var cls = $('.class');
for (var i = 0; i < cls.length; i++) {

    var myClass = cls[ i ];

    set_up_handler( myClass ); // <-- pass the current element into a function

}
1 голос
/ 29 августа 2011

Полагаю, вы не хотите использовать $.each, потому что он медленный. Причина в том, что это медленно, потому что это JQuery. так что бросьте jQuery и используйте DOM.

var els = document.getElementsByClassName("class");
for (var i = 0, ii = els.length; i < ii; i++) {
  var el = els[i];
  var src = el.src;
}

Вам понадобится прокладка для getElementsByClassName, если вы заботитесь о старых браузерах.

0 голосов
/ 29 августа 2011

Это должно быть эквивалентно вашему циклу jQuery foreach:

var elemList = $('.class');
for (var i = 0; i < elemList.length; i++) {

    var elem = $(elemList[i]);
    var myClassSrc = elem.attr('src');
    ...
}

Вам не нужно беспокоиться о this, если вы используете простой цикл for.В версии jQuery jQuery будет связывать this с текущим элементом в итерируемой коллекции.В не-jQuery-версии это эквивалентно elemList[i].

. Обратите внимание, что «класс» не является лучшим именем переменной в мире, поэтому я изменил его на «elemList».На самом деле это зарезервированное слово в JavaScript.

...