abstrakt：<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title&g
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<div id="box">
<input type="text" name="uname" value="mrH">
<input type="text" name="age" class="age" value="30">
<ul class="cont-box">
<li class="test">0</li>
<li class="test">1</li>
<li class="test">2</li>
<li>3</li>
<li>4</li>
</ul>
</div>
</body>
</html>
<script src="./js/jquery.min.js"></script>
<script>
//jq選擇器 分為
// 1 基本選則器 ；$("#id") , $(".class") , $("element") , $("#id .class element")
// 2 層級選擇器 ：$("父級>子級") ; $("祖先 后代") ； $("prev+next") 同級元素緊跟在prev的next元素 ；
// $("prev~siblings") 匹配prev后面的所有兄弟元素
// 3 順序選擇器
// a 順序 $(":first") ; $(":last")
// b 比較 $(:gt(x)) 表示大于x的元素(x的循序是從0開始); $(":lt(x)") 小于x ; $(":eq(x)") 等于x
// c 奇偶數 $(":odd")偶數
// 4 $(":not(selector)") 匹配不是selector的所有元素
// 5 內容選擇器：$(":contains(text)") 匹配包含給定文本的元素； $(":has(selector)") 匹配特定選擇器元素的元素
// $(":empty") 匹配不含有內容的元素（不包含子元素或文本為空的元素） ；$(":parent") 匹配含有子元素或文本的元素
// 6 屬性選擇器
// $("[屬性名]") 匹配包含給定屬性的元素
// $("[attribute=value]") 匹配包含給定屬性值的元素
// $("[attribute!=value]") 匹配所有不包含給定屬性值的元素
// $("[attribute^=value]") 匹配所給定屬性是以某些值開頭的元素
// $("[attribute$=value]") 匹配所給定屬性是以某些值結尾的元素
// $("[attribute*=value]") 匹配所給定屬性包含某些值結尾的元素
// $("[selector1][selector2][selectorN]") 復合選擇器，匹配同時滿足的元素
//例 匹配input元素name=age ,class=age的元素
$("input[name='age'][class='age']")
//匹配 li中文本為1的元素
$("li:contains(1)");
//匹配 匹配li中類不是test的元素
$("li:not('.test')");
//匹配第一個li
$("li:first");
//匹配div下面的ul
$("div>ul");
//匹配id為box的元素
$("#box");
</script>
Korrigierender Lehrer：滅絕師太Korrekturzeit：2019-03-11 09:03:57
Zusammenfassung des Lehrers：選擇器是jq比較具有代表性的知識點,要好好練習!