溫馨提示×
您好，登錄后才能下訂單哦！
點擊 登錄注冊 即表示同意《億速云用戶服務條款》
您好，登錄后才能下訂單哦！
這篇文章主要講解了“jQuery中的children是什么”，文中的講解內容簡單清晰，易于學習與理解，下面請大家跟著小編的思路慢慢深入，一起來研究和學習“jQuery中的children是什么”吧！
在jQuery中，children的意思為“孩子們”，是一個篩選器，用于篩選當前jQ對象的孩子，獲取符合條件的孩子，即查找所有子元素；語法為“對象.children(filter)”，參數“filter”用于設置條件，縮小搜索子元素的范圍。
本教程操作環境：windows7系統、jquery1.10.2版本、Dell G3電腦。
在jQuery中，children的意思為“孩子們”。
children是一個篩選器，顧名思義就是篩選孩子，可篩選當前jQ對象的孩子，獲取符合條件的孩子，即查找子元素。
children() 方法返回被選元素的所有直接子元素。該方法只沿著 DOM 樹向下遍歷單一層級。
語法：
$(selector).children(filter)
參數“filter”：用于設置條件，規定縮小搜索子元素范圍的選擇器表達式。
示例1：返回 <ul> 的所有直接子元素
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<script src="js/jquery-1.10.2.min.js"></script>
<style>
.descendants * {
display: block;
border: 2px solid lightgrey;
color: lightgrey;
padding: 5px;
margin: 15px;
}
</style>
<script>
$(document).ready(function() {
$("ul").children().css({
"color": "red",
"border": "2px solid red"
});
});
</script>
</head>
<body class="descendants">body (曾祖先節點)
<div style="width:500px;">div (祖先節點)
<ul>ul (直接父節點)
<li>li (子節點)
<span>span (孫節點)</span>
</li>
<li>li (子節點)
<span>span (孫節點)</span>
</li>
</ul>
</div>
</body>
</html>
示例2：縮小搜索范圍
使用 filter 參數來返回 <ul> 的直接子元素中帶有類名 "1" 的所有 <li> 元素
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<script src="js/jquery-1.10.2.min.js"></script>
<style>
.descendants * {
display: block;
border: 2px solid lightgrey;
color: lightgrey;
padding: 5px;
margin: 15px;
}
</style>
<script>
$(document).ready(function() {
$("ul").children("li.1").css({
"color": "red",
"border": "2px solid red"
});
});
</script>
</head>
<body class="descendants">body (曾祖先節點)
<div style="width:500px;">div (祖先節點)
<ul>ul (直接父節點)
<li class="1">li (子節點)
<span>span (孫節點)</span>
</li>
<li class="2">li (子節點)
<span>span (孫節點)</span>
</li>
</ul>
</div>
</body>
</html>
感謝各位的閱讀，以上就是“jQuery中的children是什么”的內容了，經過本文的學習后，相信大家對jQuery中的children是什么這一問題有了更深刻的體會，具體使用情況還需要大家實踐驗證。這里是億速云，小編將為大家推送更多相關知識點的文章，歡迎關注！
免責聲明：本站發布的內容（圖片、視頻和文字）以原創、轉載和分享為主，文章觀點不代表本網站立場，如果涉及侵權請聯系站長郵箱：is@yisu.com進行舉報，并提供相關證據，一經查實，將立刻刪除涉嫌侵權內容。
