JQuery первый ребенок из "this"

Ответ 1

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

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

Jørn Schou-Rode отметил, что вы, вероятно, только хотите найти первого прямого потомка элемента контекста, следовательно дочерний селектор ( > ), Он также указывает на, что вы можете использовать функцию children(), который очень похож на find(), но только ищет один уровень в глубине иерархии (это все, что вам нужно...):

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

Ответ 2

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

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

Ответ 3

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

notif = $('#foo')

jQuery способами:

• $(":first-child", notif) - 4 304 ops/sec - самый быстрый
• notif.children(":first") - 653 ops/sec - на 85% медленнее
• notif.children()[0] - 1,416 ops/sec - на 67% медленнее

Родные пути:

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

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

все тесты выполняются в Chrome Canary build v15.0.854.0

Ответ 4

element.children().first();

Найдите всех детей и получите первое из них.

Ответ 5

Вы пробовали

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

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

Ответ 6

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

(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 tests в Chrome 24 оно было на пару порядков быстрее, чем любое другой метод выбора на основе jQuery.

Ответ 7

используйте его так первая вещь дает имя класса для тега p как "myp"

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

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

Ответ 8

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

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

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

Ответ 9

Если вам нужен немедленный первый ребенок, вам нужно

    $(element).first();

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

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

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