[bộ chọn thuộc tính 1][bộ chọn thuộc tính n]

Đăng bởi: Admin

Định nghĩa và sử dụng

Bộ chọn [bộ chọn thuộc tính 1][bộ chọn thuộc tính n]: chọn nhiều các thành phần với từng bộ chọn cụ thể, bộ chọn thuộc tính có thể là:

Cấu trúc

Đã được thêm vào từ phiên bản 1.0

$('[bộ chọn thuộc tính 1][bộ chọn thuộc tính n]')

$('tag[bộ chọn thuộc tính 1][bộ chọn thuộc tính n]')

Ví dụ

Html viết:

<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>Tiêu đề</title>
<script src="https://code.jquery.com/jquery-latest.js"></script>
<script>
$(function(){
    $('div[id][title="Việt_Nam"]').css('border','1px solid red');
});
</script>
</head>

<body>
<div>div</div>
<div title="Việt_Nam">div có thuộc tính title với giá trị Việt_Nam</div>
<div title="Không_phải_Việt_Nam">div có thuộc tính title với giá trị Không_phải_Việt_Nam</div>
<div id="test" title="Việt_Nam">div có thuộc tính title với giá trị Việt_Nam, có id</div>
</body>
</html>

Hiển thị trình duyệt:

$('div[id][title="Việt_Nam"]'): giúp chọn thành phần có thuộc tính id, và thuộc tính title="Việt_Nam".

Ví dụ

Html viết:

<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>Tiêu đề</title>
<script src="https://code.jquery.com/jquery-latest.js"></script>
<script>
$(function(){
    $('div[class="xe_hoi"][name$="vi"]').css('border','1px solid red');
});
</script>
</head>

<body>
<div class="xe_dap">Xe dap</div>
<div name="vi_HCM">div có thuộc tính name với giá trị vi ở vị trí đầu</div>
<div name="vi">div có thuộc tính name với giá trị vi</div>
<div class="xe_hoi" name="world-vi">div có thuộc tính name với giá trị vi ở vị trí cuối</div>
</body>
</html>

Hiển thị trình duyệt:

$('div[class="xe_hoi"][name$="vi"]'): chọn thành phần có class="xe_hoi", và có thuộc tính name có giá trị vi ở cuối.

Theo dõi VnCoder trên Facebook, để cập nhật những bài viết, tin tức và khoá học mới nhất!