TOC
Need to learn JavaScript? jQuery is a JavaScript framework, so if you don't already know about the JavaScript programming language, we recommend that you learn it now: Learn JavaScript

This article is currently in the process of being translated into Vietnamese (~92% done).

Selectors:

Using elements, ID's and classes

The #id selector

Một loại selector rất phổ biến dựa trên ID như chúng ta thấy trong ví dụ "Hello, world". Chúng ta dùng thuộc tính ID của thẻ HTML để chọn. ID nên là duy nhất, bạn nên dùng selector khi bạn muốn chọn một element. Để chọn một element với ID nhất định thì cần dùng ký hiệu # và theo sau là ID như sau:

$("#divTest")

An example of it in use:

<div id="divTest"></div>
<script type="text/javascript">
$(function()
{
	$("#divTest").text("Test");
});
</script>

Giờ chỉ có một element được chọn ra trong câu trên trả về list có nghĩa nó có hơn một element nếu trong query có nhiều hơn 1 element. Ví dụ khi dùng một hay nhiều class thì có thể trả về nhiều element.

The .class selector

Thành phần với class riêng biệt có thể tìm bằng cách dùng ký tự . theo sau là tên của class. Đây là một ví dụ:

<ul>
	<li class="bold">Test 1</li>
	<li>Test 2</li>
	<li class="bold">Test 3</li>
</ul>
<script type="text/javascript">
$(function()
{
	$(".bold").css("font-weight", "bold");
});
</script>

The element selector

Bạn có thể lấy toàn bộ thành phần dựa trên tên thẻ. Ví dụ, bạn có thể lấy toàn bộ link trong trang như sau:

$("a")

Hay toàn bộ thẻ div như sau:

$("div")

Nếu bạn dùng selector nhiều thành phần giống selector class chúng ta dùng ở ví dụ trước, và chúng ta biết là chúng ta tìm thành phần cho kiểu riêng biệt thì cần chỉ ra kiểu thành phần trước selector. Không chỉ chính xác hơn mà cũng nhanh hơn để jQuery xử lý. Chúng ta xem ví dụ sau:

$("span.bold").css("font-weight", "bold");

Nó chọn ra toàn bộ thành phần với class là "bold". Tất nhiên, có thể dùng ID và nhiều dạng selector khác.

Selector có thể làm được nhiều. Đọc thêm các ví dụ thú vị khác.


This article has been fully translated into the following languages: Is your preferred language not on the list? Click here to help us translate this article into your language!