jQuery - Lấy nội dung và thuộc tính
jQuery chứa các phương thức mạnh mẽ để thay đổi và thao tác các phần tử và thuộc tính HTML.
Thao tác DOM jQuery
Một phần rất quan trọng của jQuery là khả năng thao tác với DOM.
jQuery đi kèm với một loạt các phương thức liên quan đến DOM giúp bạn dễ dàng truy cập và thao tác các phần tử và thuộc tính.
DOM = Mô hình đối tượng tài liệu
DOM xác định một tiêu chuẩn để truy cập các tài liệu HTML và XML:
"Mô hình đối tượng tài liệu W3C (DOM) là một nền tảng và giao diện trung lập về ngôn ngữ cho phép các chương trình và tập lệnh truy cập và cập nhật động nội dung, cấu trúc và kiểu dáng của tài liệu."
Nhận nội dung - text(), html() và val()
Ba phương thức jQuery đơn giản nhưng hữu ích để thao tác DOM là:
-
text()- Đặt hoặc trả về nội dung văn bản của các thành phần được chọn -
html()- Đặt hoặc trả về nội dung của các phần tử đã chọn (bao gồm cả đánh dấu HTML) -
val()- Đặt hoặc trả về giá trị của các trường biểu mẫu
Ví dụ sau đây minh họa cách lấy nội dung bằng các phương thức jQuery text() và html() :
Ví dụ
$("#btn1").click(function(){
alert("Text: " + $("#test").text());
});
$("#btn2").click(function(){
alert("HTML: " + $("#test").html());
});
Hãy tự mình thử » Ví dụ sau đây minh họa cách lấy giá trị của trường đầu vào bằng phương thức jQuery val() :
Nhận thuộc tính - attr()
Phương thức jQuery attr() được sử dụng để lấy các giá trị thuộc tính.
Ví dụ sau minh họa cách lấy giá trị của thuộc tính href trong một liên kết:
Chương tiếp theo giải thích cách thiết lập (thay đổi) giá trị nội dung và thuộc tính.
bài tập jQuery
Tài liệu tham khảo HTML của jQuery
Để có cái nhìn tổng quan đầy đủ về tất cả các phương thức HTML của jQuery, vui lòng truy cập Tài liệu tham khảo HTML/CSS jQuery của chúng tôi.
