2010-06-28 2 views
4

В этом примере (который работает) при нажатии кнопки раздел переключается видимым/невидимым. Отлично, но какой код в строке 2 на самом деле делает ?? Я нашел ссылку на: eq (0) часть here on jQuery.com, но '>' У меня нет подсказки. Под Firebug, кажется, не имеет значения, есть ли '>' или нет.JQuery> Selector

$("#btnHideShow").click(function() { 
       $("> :eq(0)", "#toggleGrid").toggle("blind"); 
       if ($("#btnHideShow").val() == "Hide List") { 
        $("#btnHideShow").val('Show List'); 
       } else { 
        $("#btnHideShow").val('Hide List'); 
       }; 
      }); 

ответ

5

Насколько я знаю, вы используете > для указания прямого ребенка, в отличие от любого потомка.

Дано:

<div class="parent"> 
    <ul class="child"> 
    <a href="#">foo</a> 
    <a href="#">bar</a> 
    </ul> 
</div> 

.parent a будет соответствовать две ссылки, но .parent > a не будет, так как они не являются прямыми потомками. Аналогично, .parent > .child также будет соответствовать, как и .child > a.

В указанном коде вы соответствуете прямым детям #toggleGrid. Если у вас есть только прямые дети, вы можете не заметить разницы, если включен >, но вам может понадобиться быть конкретным в дальнейшем по строке.

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

Заканчивать this article, если вам нужно больше информации.

+0

Хорошо, это имеет смысл. Спасибо :) – JohnnyBizzle

0

> является селектором ребенок:

5.6 Дочерние селекторы A матчи селектор дочерних когда элемент является дочерним некоторого элемента. Селектор для детей состоит из двух или более селекторов, разделенных символом «>».

Пример (ы):

Следующее правило задает стиль всех P элементов, которые являются потомками ТЕЛА:

тела> P {высота строки: 1,3} Пример (ы):

следующий пример объединяет селекторы потомков и селекторы дочерних элементов:

ДИВ ол> литий р Это соответствует P элемент, который является потомком LI; элемент LI должен быть дочерним элементом OL; элемент OL должен быть потомком DIV. Обратите внимание, что необязательное белое пространство вокруг комбинатора «>» было опущено.

-1

В соответствии с SelectORacle, > без какого-либо селектора, предшествующего ему, выбираются элементы, являющиеся дочерним элементом любого другого элемента. Таким образом, этот селектор выглядит так, что это будет означать первый дочерний элемент любого элемента, найденного под элементом «toggleGrid».

SelectORacle is here: http://penguin.theopalgroup.com/cgi-bin/css3explainer/selectoracle.py но обратите внимание, что он не понимает jQuery-isms.

редактировать — на самом деле, хотя я оставлю ссылку SelectORacle здесь, я ошибаюсь, потому что смешались с «: эк (0)»; это не то же самое, что «: first-child» duhh. Таким образом, @tv et al являются правильными, и это только первое, что является дочерним элементом под «toggleGrid».

+0

Спасибо за помощь. Это имеет смысл, поскольку в div есть div, который отображается и скрывается. – JohnnyBizzle

+0

На самом деле я ошибаюсь, по причинам, которые я не понимаю. :-) – Pointy

3

Это прямые ссылки на дочерние элементы ссылочного элемента child selector. Линия эквивалентна (и лучше написана, ИМО) до:

$('#toggleGrid > :first').toggle('blind'); 
+0

Хмммм .... правда? Теперь мне нужно написать тестовую страницу :-) – Pointy

+0

как обычно @tv! – Pointy