jQuery ready function
jQuery(document).ready(function($) {
alert('Hello world!');
});
Đoạn mã trên là một ví dụ đơn giản về cách sử dụng thư viện jQuery trong một trang web. jQuery là một thư viện JavaScript phổ biến giúp đơn giản hóa việc tương tác và thao tác với DOM (Document Object Model), xử lý sự kiện, tạo hiệu ứng hoạt hình và thực hiện các yêu cầu Ajax. Bây giờ, chúng ta sẽ phân tích từng phần của đoạn mã để hiểu rõ hơn về cách nó hoạt động.
Một ví dụ đầy đủ để thực hiện đoạn jQuery ready function
jQuery(document)
: Đây là cách gọi hàm jQuery và truyền vào đối tượngdocument
. Đối tượngdocument
đại diện cho cấu trúc HTML của trang web. Việc sử dụngjQuery(document)
giúp chúng ta có thể tương tác và thao tác với DOM thông qua các phương thức và hàm của thư viện jQuery..ready(function($) {...})
: Phương thứcready
được sử dụng để đảm bảo rằng đoạn mã bên trong nó sẽ chỉ được thực thi sau khi toàn bộ tài nguyên và cấu trúc của trang web đã được tải xong. Điều này đảm bảo rằng các thành phần HTML sẽ không bị thay đổi khiến cho đoạn mã jQuery hoạt động không đúng. Hàm bên trongready
được gọi là hàm callback, được truyền vào đối số$
. Đối số này là một biến đại diện cho hàm jQuery, cho phép chúng ta sử dụng ký hiệu$
để truy cập các phương thức và thuộc tính của jQuery trong phạm vi hàm callback này.alert('Hello world!')
: Đây là một hàm JavaScript cơ bản, khi được gọi sẽ hiển thị một cửa sổ thông báo (alert) với nội dung là “Hello world!”. Trong ví dụ này, hàmalert
được đặt bên trong hàm callback của phương thứcready
, nghĩa là nó sẽ chỉ được thực thi khi trang web đã hoàn toàn tải xong.
Tổng kết, đoạn mã jQuery trên sẽ hiển thị một cửa sổ thông báo với nội dung “Hello world!” khi trang web tải xong. Đây là một ví dụ cơ bản giúp bạn làm quen với cú pháp và cách sử dụng thư viện jQuery trong các dự án JavaScript của mình.