Sự Kiện Onload Trong Javascript Nên Hiểu Để Làm Việc Với Third

Trong bài này chúng ta sẽ tìm hiểu sự kiện window.onload trong javascript, đây là sự kiện xảy ra khi mọi tài nguyên của website đã load xong.

Bạn đang xem: Sự kiện onload trong javascript

*
*

Javascript có một sự kiện được sử dụng khá nhiều đó là sự kiện onload. Nếu bạn đã từng làm việc với jQuery thì bạn sẽ thấy thường trước khi viết bất kì đoạn code nào ta đều đặt nó trong lệnh $(document).ready(), bản chất đó chính là sự kiện onload trong Javascript.

1. Sự kiện window.onload là gì?

Sự kiện window.onload có ý nghĩa rằng khi trình duyệt đã load xong mọi thứ (image, js, css) thì những đoạn code nằm bên trong đó mới được chạy. Bạn có thể sử dụng sự kiện này với các thẻ HTML liên quan đến việc tải dữ liệu như thẻ img hoặc thẻ iframe.

Sự kiện này rất quan trọng, nó giúp ta biết được khi nào thì trình duyệt tải xong hết các tài nguyên trên hệ thống, giúp ta có thể can thiệp vào quá trình tải dữ liệu của trình duyệt.

Bài viết này được đăng tại

Trong đó phần code chính là những đoạn mã javascript mà bạn muốn chạy khi xảy ra sự kiện onload, tức là khi trình duyệt đã load xong mọi thứ.

2. Hiểu về quá trình biên dịch trong Javascript

Trong đó phần code chính là những đoạn mã javascript mà bạn muốn chạy khi xảy ra sự kiện onload, tức là khi trình duyệt đã load xong mọi thứ.

Cũng như các ngôn ngữ lập trình khác, Javascript sẽ chạy biên dịch từ trên xuống dưới và từ trái qua phải. Chính vì vậy, khi sử dụng một hàm mà phía trên nó không tồn tại hàm đó thì sẽ bị bái lỗi undefined. Và để giải quyết vấn đề này thì ta sẽ dùng sự kiện onload trong js.

Xem thêm: Bài Thơ: Bạn Đến Chơi Nhà Nguyễn Khuyến ), Nguyễn Khuyến, “Bạn Đến Chơi Nhà”

Trường hợp file js riêng

Javascript sẽ load tất cả dữ liệu của file JS xong rồi mới biên dịch, vì vậy thứ tự các hàm nằm trong cùng một file javascript là không quan trọng.

Ví dụ: Nếu đoạn code dưới đây nằm trên cùng một file thì không có lỗi mặc dù hàm do_validate được định nghĩa phía dưới.

Giả sử bạn có hàm A nằm trong file a.js và trong file b.js có sử dụng hàm A đó thì bắt buộc bạn phải import file a.js trước file b.js. Điều này tuân theo quy tắc load theo thứ tự.

Giả sử bạn có hàm A nằm trong file a.js và trong file b.js có sử dụng hàm A đó thì bắt buộc bạn phải import file a.js trước file b.js. Điều này tuân theo quy tắc load theo thứ tự.

Ví dụ: Đoạn code này sai vì hàm do_validate() mặc dù đã định nghĩa ở file a.js, nhưng nó lại được import phía dưới nên theo quy tắc là chưa được load.

Trường hợp đặt trong thẻ html

Khi các bạn gán một hàm nào đó cho một sự kiện nào đó trong HTML thì cũng phải tuân theo quy luật trên, nghĩa là nếu bạn gán một hàm mà phía trên thẻ HTML đó không có thì nó sẽ thông báo lỗi là undefined.

Xem thêm:

Khi các bạn gán một hàm nào đó cho một sự kiện nào đó trong HTML thì cũng phải tuân theo quy luật trên, nghĩa là nếu bạn gán một hàm mà phía trên thẻ HTML đó không có thì nó sẽ thông báo lỗi là undefined.Xem thêm: Trình Bày Các Đặc Điểm Nổi Bật Của Địa Hình Châu Phi Có Đặc Điểm Địa Hình Là

Ví dụ: Đoạn code này cũng sai vì hàm do_validate() ở phía trên thẻ HTML chưa được định nghĩa.