jQuery :contains() Selector - Chọn phần tử chứa chuỗi string chỉ định

views

A+A-

PrintEmail

Sử dụng jQuery để tìm những phần tử có chứa chuỗi string được chỉ định bằng bộ chọn jQuery :contains() Selector. Vậy bộ chọn này có cú pháp, cách sử dụng như thế nào? và những ví dụ cụ thể ra sao. Cùng tham khảo bài viết dưới đây

Cú pháp, Khái niệm và cách sử dụng jQuery :contains() Selector

Syntax

Bộ chọn jQuery :contains() Selector có cú pháp:

$(":contains(text)")

Trong đó text là chuỗi string được chỉ định
Trường hợp nếu bạn chọn kết hợp với bộ chọn khác. Các bạn sẽ sử dụng cú pháp:

$("selector:contains(text)")

Trong đó selector là bộ chọn khác, bắt buộc bạn phải viết liền thành selector:contains(text), nếu không jQuery sẽ không thực thi được đoạn code bạn viết nhé

Bộ chọn :contains() dùng để chọn những phần tử có chứa chuỗi string được chỉ định.

Ví dụ jQuery :contains() Selector

Ví dụ

Chọn các đoạn văn có chưa từ "jQuery"

$("p:contains(jQuery)")

Thử code »

Hoặc có thể bạn xem ví dụ ở đây.
Ví dụ: Bạn có HTML như sau:

<div id="example">
<p class="intro">Tìm hiểu tài liệu jQuery tiếng Việt .</p>
<p>Học jquery từ cơ bản đến nâng cao.</p>
<p>jQuery là gì?</p>
Các bài học về jQuery:
<ul id="choose">
  <li>jQuery là gì?</li>
  <li>Cú pháp sử dụng jQuery</li>
  <li>Các bộ chọn trong jQuery</li>
</ul>
</div>

Bấm button sau để chọn những phần tử <p> có chứa từ jQuery

Tìm hiểu tài liệu jQuery tiếng Việt .

Học jquery từ cơ bản đến nâng cao.

jQuery là gì?

Các bài học về jQuery:

• jQuery là gì?
• Cú pháp sử dụng jQuery
• Các bộ chọn trong jQuery

Và đây là code jQuery bạn phải viết:

<script>
$(document).ready(function(){  
  $("#btn1").click(function(){
    $("#example p:contains(jQuery)").css("background-color", "yellow");
  });
});
</script>

Xem thêm bài viết Tất cả bộ chọn jQuery Selectors tại đây

Chuyên Mục : Bộ chọn jQuery Học jQuery jQuery Selectors