后代元素选择器(ancestor descendant)
描述: 找到表单中所有的input元素
HTML代码
<form>
<label>Name:</label>
<input name="name" />
<fieldset>
<label>Newsletter:</label>
<input name="newsletter" />
</fieldset>
</form>
<input name="none" />
jQuery代码
$("form input")
结果
[ <input name="name" />, <input name="newsletter" /> ]
子代元素选择器(parent > child)
描述: 匹配表单中所有的子级input元素
HTML代码
<form>
<label>Name:</label>
<input name="name" />
<fieldset>
<label>Newsletter:</label>
<input name="newsletter" />
</fieldset>
</form>
<input name="none" />
jQuery代码
$("form > input")
结果
[ <input name="name" /> ]
紧邻下个元素选择器(prev + next)
描述: 匹配所有跟在label后面的input元素
HTML代码
<form>
<label>Name:</label>
<input name="name" />
<fieldset>
<label>Newsletter:</label>
<input name="newsletter" />
</fieldset>
</form>
<input name="none" />
jQuery代码
$("label + input")
结果
[ <input name="name" />, <input name="newsletter" /> ]
所有兄弟元素选择器(prev ~ siblings)
描述: 找到所有与表单同辈的input元素
HTML代码
<form>
<label>Name:</label>
<input name="name" />
<fieldset>
<label>Newsletter:</label>
<input name="newsletter" />
</fieldset>
</form>
<input name="none" />
jQuery代码
$("form ~ input")
结果
[ <input name="none" /> ]
摘自 jQuery API 文档