jQuery селектор ребенка без родителей

Я смотрел на некоторый код из учебника по созданию меню карусели и заметил родительские дочерние селекторы без родительского. Никогда не видел этого раньше и смущен тем, что он на самом деле делает.

см. следующий код:

        var $wrapper = $('> div', this).css('overflow', 'hidden'),
        $slider = $wrapper.find('> ul'),
        $items = $slider.find('> li'),
        $single = $items.filter(':first'),

        singleWidth = $single.outerWidth(), 
        visible = Math.ceil($wrapper.innerWidth() / singleWidth), // note: doesn't include padding or border
        currentPage = 1,
        pages = Math.ceil($items.length / visible);

учебник здесь: http://jqueryfordesigners.com/jquery-infinite-carousel/

10
jquery jquery-selectors

3 ответов

есть родитель(или в данном случае scope), обратите внимание на this ключевое слово внутри селектора, это относительно элемента, к которому применяется плагин.

селекторы jQuery позволяют установить область, и это может быть любой объект элемента jQuery.

считают 

$(".somediv").myplugin();

и внутри плагина

$("> div", this) 
is actually translated to 
$("> div", $(".somediv"))

взгляните на один из моих вопросов, ответ объясняет довольно много о jQuery селекторы. каков самый быстрый метод выбора элементов-потомков в jQuery?

3

этот селектор с контекстом:

$('> div', this)

получает перевернутый вокруг, чтобы использовать .find() такой:

$(this).find('> div')

, который с > ребенок-селектор всего:

$(this).children('div')

другие делают то же дело, они могли бы использовать .children(), и на самом деле было бы более эффективно сделать это.

7
$('> div', this)

на this важно. Это параметр контекста, который делает запрос, равной

$(this).children('div');

посмотреть документация $() для получения дополнительной информации; он говорит об этом:

внутренне, контекст селектора реализован при .метод find, так что $('span', this) эквивалентно $(this).find('span').

$(this).find('> div') означает " the divs, которые являются детьми this, что равно $(this).children('div').

1