Блог

Я создаю массив тегов div внутри таблицы игроков div. Я получаю все теги div с помощью class .players. Div с именем класса.у игроков есть поля ввода и поле ссылки внутри. Я хочу иметь возможность манипулировать ими (удалять, добавлять класс и т. Д.)

То, что, как я думал, сработает, будет что-то вроде:

 $(divarray[j] ' .link').hide();
$(divarray[j] ' a').remove('.link');
 

Но это не работает. Есть какие-нибудь мысли? Я уверен, что это что-то простое, но я впервые в JS 🙂

 var divarray = $('#player-table > .players');
        for( var j = 0; j < 10; j  ){
        $(divarray[j]).removeClass("players");
        $(divarray[j]).addClass("selected_players");
        $('#debug').append(divarray[j]);
        $(divarray[j] ' a').hide();
    }
 

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

Во-вторых, с помощью jQuery есть гораздо лучшие способы обработки набора элементов. Вот ваш код в более похожем на jQuery виде. Это всего лишь пример, потому что я не знаю структуру HTML. Вы должны настроить его так, чтобы он выбирал и применял к правильным элементам.

 $('#player-table > .players').slice(0,10) // gets the first 10 elements
 .removeClass("players")                  // removes the class from all of them
 .addClass("selected_players")            // adds the class
 .find('a').hide().end()                  // finds all descendant links and hides them
 .appendTo('#debug');                     // appends all elements to `#debug`
 

Как вы, возможно, видите, в последней строке есть только одна точка с запятой. Это означает, что весь этот блок кода представляет собой всего лишь один оператор, но разделение его на несколько строк повышает читаемость.

Это работает благодаря плавному интерфейсу — концепции, которую активно использует jQuery. Это позволяет вам избежать создания объектов jQuery снова и снова, как вы это делаете ( $(divarray[j]) ).

Другим преимуществом является то, что вы можете работать со всем набором элементов одновременно, и вам не нужно перебирать каждый элемент явно, как это происходит с «обычными» методами манипулирования DOM.

Для изучения JavaScript я рекомендую руководство по MDN JavaScript.
В jQuery есть несколько руководств и очень хорошая документация по API.

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

Попробуйте следующие инструкции

 $(divarray[j]).find('.link').hide();
$(divarray[j]).find('a').remove('.link');
 

Попробуйте также

 $(divarray[j]).find('.link:first').hide();  
 

Если вам нужно работать только с первым элементом

Надеюсь, это поможет