Ссылка на элемент $ (this) в jQuery

Question

Я перебираю ряд элементов в jQuery (намеренно).

Так что в основном я хочу что-то вроде этого, но с правильным синтаксисом:

$(".sonicrow").each(function() {
    $(this + 'somediv').css('background-color', 'red');
});

Очевидно, этокакой-то объект / строка мешанина.Какой будет правильный синтаксис для доступа к конкретному somediv внутри этого объекта?

Спасибо, Джон.

Answer 1

$(".sonicrow").each(function() {
    $('somediv', this).css('background-color', 'red');
});

Где вторым параметром является «контекст» селектора. Конечно, ваш somediv должен быть .somediv, если это класс, или #somediv, если это идентификатор.

Этот вопрос относится к Как получить дочерние элементы селектора $ (this)? , который также содержит этот ответ

...
    $(this).find('somediv').css(...)
...

Согласно контекстный селектор jQuery $(selector, context) реализован с $(context).find(selector).

Answer 2

$(".sonicrow").each(function() {
    $(this).find('.somediv').css('background-color', 'red');
});

вы можете сделать это.

Answer 3

Попробуйте это:

$(".sonicrow").each(function() {
    $(this).find('somediv').css('background-color', 'red');
});

Answer 4

Алгоритм:

HTML структура - это древовидная структура. Поэтому, когда вы ссылаетесь на $(".sonicrow"), вы достигаете узла с «sonicrow» в качестве имени класса. Теперь вам нужно искать дочерние узлы, которые являются div ...

Итак, ваш код будет выглядеть примерно так:

1. Найти элементы с именем класса "sonicrow"
2. Найдите любой дочерний элемент с типом "div" ...
3. Применить css

---

Решение:

Найти ссылку на узлы, имеющие "sonicrow" в качестве имени класса: var route=$(".sonicrow");

Найти дочерние узлы, которые являются div: var desiredChild = route.find("div");

Применить css: desiredChild.css("property","value"); ...

---

Объединить это в цепочку jquery:

$(".sonicrow").find("div").css('background-color', 'red');

Но вы хотите повторить это для каждого элемента, у которого есть имя класса «sonicrow», поэтому вы должны выполнить цикл, и ваш код станет:

$(".sonicrow").each(function() 
{
    $(this).find("div").css('background-color', 'red');
});

P.S. Я использовал $ (this) здесь, потому что $ (". Sonicrow") возвратил объект, и вы пересекаете этот конкретный объект, поэтому вы должны использовать "this" variable, чтобы указать на этот элемент.

С другой стороны, вы используете Jquery, поэтому $ (this) предоставляет вам объект jquery для работы, в противном случае вам пришлось бы использовать базовый синтаксис javascript, такой как: this.style.css.property=value синтаксис: -)

Надеюсь, вы получили ответ ...