Я пытаюсь добавить divs внутри пары div с определенным классом, а именно ".description"
.
Затем я хочу, чтобы каждый внутренний div имел другой класс, но он работает только для первого div с вышеупомянутым классом.
Это код:
function addDescriptionFields() {
var i=0;
for(i=1; i<=3; i++) {
$(".description").append("<div></div>");
}
$(".description").each(function() {
$(".description div").eq(0).addClass("game-name");
$(".description div").eq(1).addClass("game-description");
$(".description div").eq(2).addClass("game-popularity");
});
}
Итак, результат состоит в том, что первый div с классом ".description"
имеет все div внутри него с указанными классами, но другие divs этого не делают. Кто-нибудь знает, что я делаю неправильно?
Цикл each()
бесполезен, так как внутри него вы делаете $(".description div").eq(0)
, который выбирает только первый элемент в этой коллекции, а не первый в каждом .description
.
Вам придется изменить его на нечто подобное
function addDescriptionFields() {
for(var i=1; i<=3; i++) {
$(".description").append("<div></div>");
}
$(".description").each(function() {
$("div", this).eq(0).addClass("game-name");
$("div", this).eq(1).addClass("game-description");
$("div", this).eq(2).addClass("game-popularity");
});
}
Лучшим подходом было бы сделать
function addDescriptionFields() {
var classes = ["game-name", "game-description", "game-popularity"],
description = $(".description");
$.each(classes, function(_, klass) {
description.append("<div class='"+klass+"' />");
}
}
Это должно быть так: var descClasses = ["game-name", "game-description", "game-popular"]; $ ('. description> div'). each (function (index) {$ (this).addClass(descClasses [index])});