Review: DOM access with jQuery

Để tìm các phần tử DOM với jQuery, chuyển một bộ chọn CSS hợp lệ vào hàm jQuery:

$("h1"); // selects all the h1s
$("#heading"); // selects the element with id of "heading"
$(".warning"); // selects all the elements with class name of "warning"

Lưu ý rằng hàm jQuery có thể được đặt tên $hoặc jQuery, vì vậy chúng giống như:

jQuery("h1");  
jQuery("#heading");  
jQuery(".warning");

Nhiều người thích $vì nó quá ngắn.

Hàm jQuery sẽ luôn trả về một tập hợp các phần tử phù hợp của jQuery, ngay cả khi chỉ có một phần tử phù hợp - hoặc không có phần tử nào! Bạn có thể đọc thêm về hàm jQuery trong tài liệu của họ.

Khi bạn đã tìm thấy các phần tử DOM với jQuery, bạn có thể thực hiện những việc như đặt nội dung bên trong của chúng với text(): $("#temperature").text("89° Fahrenheit"); (Xem ví dụ đầy đủ)

Bạn có thể sử dụng cùng một phương thức text()để có được nội dung bên trong, bằng cách chuyển cho nó 0 tham số:
var heading = $("#heading").text();

Trong hướng dẫn tiếp theo, bạn sẽ tìm hiểu thêm nhiều phương thức để nhận và đặt thuộc tính của các thành phần DOM.

Đằng sau, tất cả các hàm jQuery này đều sử dụng API DOM mà chúng tôi đã dạy trong khóa học HTML / JS . Ví dụ, $hàm sử dụng các phương thức như getElementById()và querySelectorAll(), và attr()sử dụng getAttribute()phương thức. Khi bạn sử dụng $hàm, bạn có thể sử dụng các hàm đó trong ít dòng mã hơn và cũng biết rằng mã của bạn sẽ hoạt động trong tất cả các trình duyệt được hỗ trợ của jQuery, điều này đặc biệt quan trọng khi sử dụng các hàm DOM API gần đây.