子元素选择器 (“parent > child”)
child selector
描述:选择用“parent”指定的元素下面所有的用“child”指定的直接子元素。
加入于: 1.0
jQuery( "parent > child" )parent: 任何有效的选择器。
child: 一个用来过滤子元素的选择器。
作为一个CSS选择器,子元素组合器受所有的现代web浏览器支持,包括Safari、Firefox、Opera、Chrome以及Internet Explorer 7以之后的版本,但是不受Internet Explorer 6及以前的版本支持。然而,在jQuery中,该选择器(以及别的选择器)能够跨所有支持的浏览器起作用,包括IE6。
该子元素组合器(E > F)可以被想象成一个特殊的形式的后代元素组合器(E F),它只选择第一级的后代元素。
示例
给所有的作为<ul class="topnav">的子元素的列表项目加个边框。
<!doctype html> <html lang="en"> <head> <meta charset="utf-8"> <title>child demo</title> <style> body { font-size: 14px; } </style> <script src="https://code.jquery.com/jquery-1.10.2.js"></script> </head> <body> <ul class="topnav"> <li>Item 1</li> <li>Item 2 <ul> <li>Nested item 1</li> <li>Nested item 2</li> <li>Nested item 3</li> </ul> </li> <li>Item 3</li> </ul> <script> $( "ul.topnav > li" ).css( "border", "3px double red" ); </script> </body> </html>
演示结果