Bộ Chọn

Sử dụng jQuery cho phép bạn lựa chọn phần tử HTML một cách dễ dàng thông qua Bộ Chọn (tên tiếng Anh là selector). Có rất nhiều bộ chọn khác nhau trong jQuery như bộ chọn phần tử, bộ chọn id, bộ chọn class...

Bộ Chọn Phần Tử

Bộ chọn phần tử lựa chọn phần tử HTML dựa theo tên của phần tử trong trang HTML mà bạn muốn lựa chọn. Ở ví dụ dưới đây dùng để lựa chọn phần tử button và phần tử p:

$("button").click(function () {
    $("p").css("color", "#4CAF50");
});

Chạy

Bộ Chọn ID

Sử dụng bộ chọn ID dùng để lựa chọn phần tử thông qua giá trị id của phần tử đó. Bộ chọn ID thường được sử dụng khi chúng ta muốn lựa chọn một phần tử duy nhất có giá trị ID nhất định. Ví dụ dưới đây sử dụng bộ chọn ID để lựa chọn phần tử p đầu tiên với giá trị ID là #first-para:

$("button").click(function () {
    $("#first-para").css("color", "#4CAF50");
});

Chạy

Bộ Chọn Lớp

Bộ chọn lớp được sử dụng để chọn phần tử dựa trên giá trị của lớp (class) CSS. Bộ chọn lớp sẽ trả về một bộ sưu tập gồm các phần tử có giá trị lớp CSS trùng với giá trị tìm kiếm.

Ví dụ dưới đây chúng ta sẽ tìm các ký tự toán học sử dụng bộ chọn lớp $(".operator") sau đó đổi màu các ký tự toán học này sang màu xanh dương:

$(".operator").css("color", "#4CAF50");

Chạy

jQuery Cơ Bản


Thảo Luận


Chưa có câu hỏi nào cho bài hướng dẫn này
Đặt câu hỏi

Mời Bạn Bè

Gửi email mời bạn bè tham gia khóa học

Viết Cùng Tác Giả

Bạn biết về chủ đề này và muốn tham gia viết cùng tác giả?