Xem Mục lục lập trình JQuery
Với jQuery bạn chọn các đối tượng HTML và xử lý các sự kiện trên chúng.
Cú pháp jQuery
Cú pháp cơ bản là: $(selector).action()
- Dấu $ đế xác định/truy cập jQuery
- 01 (selector) để "truy vấn (hoặc tìm)" các phần tử HTML.
-
01
jQuery action() để thực hiện thao tác trên các đối
tượng(s)
$(this).hide() - ẩn phần tử hiện hành.
$("p").hide() - ẩn tất cả thẻ <p>.
$(".test").hide() - ẩn tất cả phần tử có class="test".
$("#test").hide() - ẩn tất cả phần tử có id="test".
Bạn
có quen thuộc với CSS selectors?
jQuery sử dụng cú pháp CSS để chọn lựa các phần tử. Bạn sẽ học thêm về cú pháp selector trong bài tiếp theo.
jQuery sử dụng cú pháp CSS để chọn lựa các phần tử. Bạn sẽ học thêm về cú pháp selector trong bài tiếp theo.
Sự kiện Document Ready
Bạn có thể thấy rằng tất cả các phương thức jQuery trong các ví dụ, được đặt trong:
$(document).ready(function(){
// phương thức jQuery đặt ở đây...
});
// phương thức jQuery đặt ở đây...
});
Điều này để ngăn ngừa bất kỳ đoạn mã jQuery nào chạy trước khi trang web tải xong (is ready = sẵn sàng).
Đây là 01 thói quen tốt. Nó cũng cho phép mã JavaScript chạy trước thẻ body, trong phần <head>.
Đây là vài ví dụ về hành động có thể chạy sai khi trang web chưa được tải xuống:
- Cố ẩn đi 01 phần tử chưa được tạo ra.
-
Cố
thay đổi kích thước của 01 hình ảnh chưa được tải.
Mẹo: Nhóm phát triển jQuery cũng tạo ra 01 phương thức ngắn hơn phương thức document ready event:
$(function(){
// jQuery methods go here...
});
// jQuery methods go here...
});
Bạn có thể dùng 01 trong 02
phương thức trên tùy bạn thấy cái nào dễ hiểu hơn.
Không có nhận xét nào:
Đăng nhận xét