任何人都可以快速解释以下JS代码

Question

$('#menu1 > li > a.expanded + ul').slideToggle('medium');

我想了解

$('#menu1 > li > a.expanded + ul')

一部分。对此的上下文是我正在创建一个可折叠的菜单。

Answer 1

$('#menu1 > li > a.collapsed')

上述语句表示获取菜单父级的直接li子级，并使用类名collapsed作为li

的直接子级

<强> HTML

<ul id="menu1">
    <li><a href="" class="collapsed">only this will get selected.</a></li>
    <li><a href="" class="collapsed"></a></li>
</ul>

Answer 2

• tag搜索具有特定标记名称的元素
• #id搜索具有特定ID
的元素
• .class搜索具有特定类
的元素
• a > b搜索匹配b的元素，这些元素是与
匹配的元素的子元素

这意味着：

#menu > li > a.collapsed搜索所有<a>个类已折叠，它们是<li>的直接子元素，它们是id <元素的直接子元素EM>菜单

Answer 3

＃menu1＆gt; li 返回＃menu1

的直接子节点的所有“li”

li＆gt; a.collapsed - 这将返回所有已折叠类的超链接，这些超链接是“li”的直接子级

基本上 $（'menu1＆gt; li＆gt; a.collapsed'）会返回所有已折叠类的超链接，它们是“li”元素的直接子元素，它们是＃的直接子元素MENU1

Answer 4

您可以在here或here

中找到有关此内容的更多信息

$('#menu1 > li > a.collapsed')   

意味着选择所有＆＃34; a＆＃34;类＃＆34;折叠＆＃34;这是＆＃34; li＆＃34;的直接子元素。这是具有id＆＃34; menu1＆＃34;的元素的直接子元素。 。

Answer 5

这是父子关系的JQuery选择器。 See docs here

基本上是说：

1. 查找ID menu1
2. 找到直接子li
3. 找到一个直接孩子a，其中包含课程collapsed

Answer 6

获取带有id menu1的元素中listitems（li）的折叠类的所有锚点（a）。 另请参阅：http://api.jquery.com/category/selectors/