jquery内容选择器
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
<script src="../../Document/lib/jquery-3.2.1.min.js"></script>
<title>jquery 选择器</title>
<style type="text/css">
.text {
color:green;
font-size:36px;
}
</style>
</head>
<body>
<h2>内容选择器</h2>
<div style="width:100%;background-color:#dcdcdc">
<div>John Resig</div>
<div>George Martin</div>
<div>Malcom John Sinclair</div>
<div>J. Ohn
<table>
<tr><td>Value 1</td><td></td></tr>
<tr><td>Value 2</td><td></td></tr>
</table>
<div><p id="id01">Hello</p></div>
<div>Hello again!</div>
<!-- hidden & visible -->
<table>
<tr style="display:none"><td>Value hidden</td></tr>
<tr><td>Value 2</td></tr>
</table>
<form action="">
<input type="hidden" value="hidden"/>
<input type="text" value="text"/>
</form>
</div>
<script type="text/javascript">
// :contains(text)
// :empty
// :has(selector)
// :parent
// 忽略大小写,忽略中间隔的字符
// alert($("div:contains('John')").length);// 3
// alert($("td:empty").length);// 2
// $("div:has(p)").addClass("text");
// alert($("td:parent").length);
// alert($("tr:hidden").text());
// alert($("tr:visible").text());
// alert($('input:hidden')[0].value);
// alert($('input:visible')[0].value);
</script>
</body>
</html>