jQuery первый дочерний элемент этого

Если вы хотите применить селектор к контексту, предоставленному существующим набором jQuery, попробуйте функцию find ():

element.find(">:first-child").toggleClass("redClass");

Йорн Скоу-Роде отметил, что вы, вероятно, хотите найти только первого прямого потомка элемента контекста, поэтому дочерний селектор (>). Он также указывает, что с таким же успехом можно использовать children () function, которая очень похожа на find (), но выполняет поиск только на одном уровне в глубине иерархии (т.е. все, что тебе нужно...):

element.children(":first").toggleClass("redClass");

Используйте children функцию с _ 2_ selector, чтобы получить единственный первый дочерний элемент element:

element.children(":first").toggleClass("redClass");

Я добавил тест jsperf, чтобы увидеть разницу в скорости для разных подходов к получению первого ребенка (всего 1000+ детей)

дано, notif = $('#foo')

Способы jQuery:

1. $(":first-child", notif) - 4,304 операций в секунду - самый быстрый
2. notif.children(":first") - 653 операций / сек - на 85% медленнее
3. notif.children()[0] - 1416 операций в секунду - на 67% медленнее

Собственные способы:

4. Собственный JavaScript 'ele.firstChild - 4 934 323 операций / сек (все вышеперечисленные подходы на 100% медленнее по сравнению с firstChild)
5. Собственный элемент DOM из jQery: notif[0].firstChild - 4 913 658 операций / сек.

Итак, первые 3 подхода jQuery не рекомендуются, по крайней мере, для первого ребенка (я сомневаюсь, что так будет и со многими другими). Если у вас есть объект jQuery и вам нужно получить первый дочерний элемент, тогда получите собственный элемент DOM из объекта jQuery, используя ссылку на массив [0] (рекомендуется) или .get(0) и используйте ele.firstChild. Это дает те же результаты, что и при обычном использовании JavaScript.

все тесты проводятся в сборке Chrome Canary v15.0.854.0

element.children().first();

Найдите всех детей и станьте первым из них.

Ты пробовал

$(":first-child", element).toggleClass("redClass");

Я думаю, вы хотите установить свой элемент в качестве контекста для поиска. Может быть лучший способ сделать это, который какой-нибудь другой гуру jQuery запрыгнет сюда и бросит вам :)

вы можете использовать DOM

$(this).children().first()
// is equivalent to
$(this.firstChild)

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

(function ($) {
    var useElementChild = ('firstElementChild' in document.createElement('div'));

    $.fn.firstChild = function () {
        return this.map(function() {
            if (useElementChild) {
                return this.firstElementChild;
            } else {
                var node = this.firstChild;
                while (node) {
                    if (node.type === 1) {
                        break;
                    }
                    node = node.nextSibling;
                }
                return node;
            }
        });
    };
})(jQuery);

Это не так быстро, как чистое решение DOM, но в тестах jsperf в Chrome 24 он был на пару порядков быстрее, чем любой другой метод на основе селектора jQuery.

пожалуйста, используйте это так, во-первых, дайте имя класса для тега p, например "myp"

затем используйте следующий код

$(document).ready(function() {
    $(".myp").click(function() {
        $(this).children(":first").toggleClass("classname"); // this will access the span.
    })
})

Это можно сделать с помощью такой простой магии:

$(":first-child", element).toggleClass("redClass");

Ссылка: http://www.snoopcode.com/jquery/jquery-first-child-selector

Если вы хотите, чтобы сразу появился первый ребенок, вам нужно

    $(element).first();

Если вам нужен конкретный первый элемент в dom из вашего элемента, используйте ниже

    var spanElement = $(elementId).find(".redClass :first");
    $(spanElement).addClass("yourClassHere");

попробуйте: http://jsfiddle.net/vgGbc/2/