:parent
选择所有父元素,即含有子元素的元素,文本节点也算是子元素。
-
1.0 新增:parent
这个选择器与 :empty
正好相反。
需要注意的是,:parent
(和 :empty
) 所涉及的子元素,包括文本节点。
W3C 建议 <p>
元素应当至少包含一个子元素,即使那个子元素仅仅是一个文本节点也好。(参考 http://www.w3.org/TR/html401/struct/text.html#edef-P)。另一方面,某些元素始终没有子元素或子元素始终是空的。比如: <input>
, <img>
, <br>
, 和 <hr>
。
补充说明:
- 由于
:parent
是 jQuery 扩展出来的,它并不是 CSS 规范中的一部分。当使用:parent
时,并不会比使用原生的 DOM 方法querySelectorAll()
性能好。为了达到高效的:parent
元素选择,请优先使用纯 CSS 选择器.filter(":parent")
。
示例:
查找含有子元素的 td 元素,包括含有文本的 td。
<!DOCTYPE html>
<html>
<head>
<style>
td { width:40px; background:green; }
</style>
<script src="jquery.min.js"></script>
</head>
<body>
<table border="1">
<tr><td>Value 1</td><td></td></tr>
<tr><td>Value 2</td><td></td></tr>
</table>
<script>
$("td:parent").fadeTo(1500, 0.3);
</script>
</body>
</html>