06/04/2021, 14:49
Hàm Child Selector (“parent > child”) trong jQuery - JQuery API
Cú pháp jQuery( "parent > child" )
Child Selector sẽ lựa chọn tất cả các phần tử con trực tiếp được chỉ định bởi "child" của các phần tử được chỉ định bởi "parent".
Lưu ý rằng selector này sẽ chỉ chọn ra các phần tử là con cấp một của phần tử "parent".
Cú pháp
Cú pháp
jQuery( "parent > child" )
Trong đó:
- parent là một selector hợp lệ bất kì.
- child là một bộ lọc để lọc các phần tử con cần thiết.
Ví dụ
Tìm kiếm tất cả các thẻ li nằm trong thẻ ul có class=topnav và đổi màu cho chúng:
Code
RUN
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>all demo</title>
<style>
textarea {
height: 35px;
}
div {
color: red;
}
fieldset {
margin: 0;
padding: 0;
border-width: 0;
}
.marked {
background-color: yellow;
border: 3px red solid;
}
</style>
<script src="https://Zaidap.com.net/cnd/js/jquery/jquery-3.2.1.min.js"></script>
</head>
<body>
<h1>Học lập trình miễn phí tại Zaidap.com.net</h1>
<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>
<div id="result"></div>
<button onclick="myFunction()">Click vào đây để xem kết quả</button>
<script>
function myFunction(){
$( "ul.topnav > li" ).css( "border", "3px double red" );
}
</script>
</body>
</html>Kết quả:
Tham khảo: jquery.com
Nguồn: Zaidap.com.net