- Tham gia
- 28/02/2015
- Bài viết
- 16,989
- Được Like
- 12,732
jQuery Syntax - Cú pháp jQuery
Với jQuery bạn chọn (truy vấn) các phần tử HTML và thực hiện "hành động" vào chúng.
Cú pháp jQuery
Cú pháp jQuery là thiết kế riêng làm cho việc lựa chọn các phần tử HTML và thực hiện một số hành động trên các phần tử.
Cú pháp cơ bản là: $(selector).action()
$(this).hide() - ẩn các phần tử hiện tại.
$("p").hide() - ẩn tất cả phần tử <p>.
$(".test").hide() - ẩn tất cả phần tử với class="test".
$("#test").hide() - ẩn phần tử với id="test".
Tài liệu sẵn sàng cho sự kiện
Bạn có thể thấy rằng tất cả các phương pháp jQuery trong ví dụ của bạn, đang ở trong một tài liệu sẵn sàng cho sự kiện.
Điều này là để ngăn chặn bất kỳ mã jQuery chạy trước khi tài liệu được tải xong (sẵn sàng).
Đó là thực tế tốt để chờ đợi cho các tài liệu được nạp đầy đủ và sẵn sàng trước khi làm việc với nó. Điều này cũng cho phép bạn có mã JavaScript trước body của tài liệu của bạn, trong phần head.
Dưới đây là một số ví dụ về các hành động có thể thất bại nếu các phương pháp được chạy trước khi tài liệu được nạp đầy đủ:
Sử dụng cú pháp mà bạn thích. Chúng tôi nghĩ rằng tài liệu sẵn sàng cho sự kiện là dễ hiểu khi đọc mã.
Chúc các bạn thành công.
Với jQuery bạn chọn (truy vấn) các phần tử HTML và thực hiện "hành động" vào chúng.
Cú pháp jQuery
Cú pháp jQuery là thiết kế riêng làm cho việc lựa chọn các phần tử HTML và thực hiện một số hành động trên các phần tử.
Cú pháp cơ bản là: $(selector).action()
- $ dấu hiệu xác định/truy cập jQuery
- (selector) đến "truy vấn (hoặc tìm)" phần tử HTML
- jQuery action() được thực hiện trên các phần tử
$(this).hide() - ẩn các phần tử hiện tại.
$("p").hide() - ẩn tất cả phần tử <p>.
$(".test").hide() - ẩn tất cả phần tử với class="test".
$("#test").hide() - ẩn phần tử với id="test".
Bạn quen thuộc với bộ chọn CSS?
jQuery sử dụng cú pháp CSS để chọn các phần tử. Bạn sẽ tìm hiểu thêm về cú pháp selector trong bài viết tiếp theo của hướng dẫn này.
Tài liệu sẵn sàng cho sự kiện
Bạn có thể thấy rằng tất cả các phương pháp jQuery trong ví dụ của bạn, đang ở trong một tài liệu sẵn sàng cho sự kiện.
Mã:
$(document).ready(function(){
// jQuery methods go here...
});
Điều này là để ngăn chặn bất kỳ mã jQuery chạy trước khi tài liệu được tải xong (sẵn sàng).
Đó là thực tế tốt để chờ đợi cho các tài liệu được nạp đầy đủ và sẵn sàng trước khi làm việc với nó. Điều này cũng cho phép bạn có mã JavaScript trước body của tài liệu của bạn, trong phần head.
Dưới đây là một số ví dụ về các hành động có thể thất bại nếu các phương pháp được chạy trước khi tài liệu được nạp đầy đủ:
- Đang cố gắng để che giấu một phần tử mà chưa được tạo
- Đang cố gắng để có được kích thước của một hình ảnh không được nạp
Mã:
$(function(){
// jQuery methods go here...
});
Sử dụng cú pháp mà bạn thích. Chúng tôi nghĩ rằng tài liệu sẵn sàng cho sự kiện là dễ hiểu khi đọc mã.
Chúc các bạn thành công.
Nguồn: w3schools.com
Bài viết liên quan
Bài viết mới