14/08/2018, 09:39
:empty Selector trong jquery
Empty Selector sẽ chọn các tất cả các phần tử không chứa các phần tử con khác( bao gồm cả các đoạn văn bản). Phương thức này là đảo ngược của selector :parent . Một điều rất quan trọng cần lưu ý là các đoạn văn bản cũng sẽ được tính là phần tử con, vì vậy những phần tử có chứa văn bản ...
Empty Selector sẽ chọn các tất cả các phần tử không chứa các phần tử con khác( bao gồm cả các đoạn văn bản).
Phương thức này là đảo ngược của selector :parent.
Một điều rất quan trọng cần lưu ý là các đoạn văn bản cũng sẽ được tính là phần tử con, vì vậy những phần tử có chứa văn bản sẽ không được Empty Selector lựa chọn.
W3C có chỉ ra rằng các phần tử <p> có ít nhất một thẻ con, ngay cả khi nó chỉ là một đoạn văn bản. Mặt khác có một số thẻ luôn empty ví dụ như: <input>, <br>, <img> ...
Cú pháp
Cú pháp
jQuery( ":empty" )
Ví dụ
Tìm kiếm tất cả các thẻ không chứa các phần tử con và đổi màu nền cho chúng:
Code
RUN
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>all demo</title>
<script src="https://code24h.com/cnd/js/jquery/jquery-3.2.1.min.js"></script>
</head>
<body>
<h1>Học lập trình miễn phí tại code24h.com</h1>
<div>
<input type="text" name="text">
<div style="awidth: 50px; height: 20px;"></div>
<div>This is a test 3</div>
<div>This is a test 3</div>
</div>
<input type="text" name="test" disabled="disabled">
<input type="button" name="button" value="Button" disabled="disabled">
<h2>This is H2 content</h2>
<button onclick="myFunction()">Click vào đây để xem kết quả</button>
<script>
function myFunction(){
$( ":empty" ).css( "background", "red");
}
</script>
</body>
</html>Kết quả:
Tham khảo: jquery.com
Các loại api khác
- jQuery Selector
- jQuery Events
Nguồn: code24h.com
