Trong JavaScript, bạn làm mới trang bằng cách sử dụng document.location.reload(). Bạn có thể thêm từ khóa true để buộc trang được tải lại đến từ máy chủ (thay vì bộ đệm). Ngoài ra, bạn có thể sử dụng từ khóa false để tải lại trang từ bộ đệm
Mã này có thể được gọi tự động khi có sự kiện hoặc đơn giản khi người dùng nhấp vào liên kết
Mã làm mới JavaScript mẫu
Chạy
Trình chỉnh sửa ngăn xếp Trình chỉnh sửa ngăn xếp
Xem trước trình chỉnh sửa
Tự động làm mới
Bạn cũng có thể sử dụng JavaScript để tự động làm mới trang sau một khoảng thời gian nhất định. Ở đây, chúng tôi đang làm mới trang 5 giây sau khi tải trang. Điều này dẫn đến việc trang liên tục được làm mới sau mỗi 5 giây
Chạy
Trình chỉnh sửa ngăn xếp Trình chỉnh sửa ngăn xếp
Xem trước trình chỉnh sửa
Bạn có thể đạt được hiệu quả tương tự bằng cách sử dụng thẻ meta HTML
Các thủ thuật làm mới khác
Bằng cách bao gồm mã làm mới của bạn trong một chức năng, bạn có thể kiểm soát hoàn toàn thời điểm trang được làm mới
ví dụ 1
Thay vì chức năng "làm mới trang" được gọi tự động khi tải trang, bạn chỉ có thể gọi nó khi người dùng thực hiện một số hành động - chẳng hạn như nhấp vào liên kết
Chạy
Trình chỉnh sửa ngăn xếp Trình chỉnh sửa ngăn xếp
Xem trước trình chỉnh sửa
ví dụ 2
Bạn có thể sử dụng câu lệnh điều kiện để quyết định có làm mới trang hay không. Đây là một ví dụ cơ bản về việc sử dụng hộp "xác nhận" để hỏi người dùng xem có đồng ý làm mới trang không
Chạy
Trình chỉnh sửa ngăn xếp Trình chỉnh sửa ngăn xếp
Xem trước trình chỉnh sửa
Bằng cách kết hợp mã làm mới với chức năng JavaScript, bạn có thể kích hoạt làm mới bất kỳ lúc nào phù hợp với ứng dụng web của mình
Làm mới HTML
Các ví dụ trên sẽ chỉ hoạt động miễn là người dùng đã bật JavaScript trên trình duyệt của họ. Bạn cũng có thể sử dụng HTML để tự động làm mới trang sau khi trang tải xong. Điều này đạt được bằng cách sử dụng thẻ meta HTML
Trong khi sử dụng JavaScript, bạn có thể muốn làm mới trang web bằng mã của mình. Hãy để chúng tôi xem xét các cách khác nhau để làm như vậy
Ở đây chúng ta sẽ tìm hiểu các phương pháp sau để làm mới trang web bằng JavaScript
1. Làm mới một trang trong JavaScript
Trong JavaScript, trang được tải lại bằng tài liệu. vị trí. reload() hoặc cửa sổ. vị trí. phương thức tải lại (). Địa điểm. reload() cho kết quả giống như nhấn nút tải lại trên trình duyệt của bạn
Theo mặc định, phương pháp này tải lại trang trực tiếp từ bộ đệm của trình duyệt. Nếu thuộc tính forceGet được đặt thành true, thì trang web sẽ được tải lại từ máy chủ.
Tải lại trang từ bộ đệm
Thí dụ
Page Reload Uisng JavascriptTải lại trang từ máy chủ (không có bộ đệm)
Page Reload Uisng Javascript without CacheTham số mặc định là Sai ở đây. Vì vậy, nếu để trống tham số, đối tượng. reload() tải lại trang bằng cách sử dụng dữ liệu được lưu trong bộ nhớ cache của trình duyệt, tôi. e. giống hệt với việc sử dụng phương thức làm đối tượng. tải lại (sai)
2. Tự động làm mới trang sau 5 giây
Page Reload Uisng Javascript after 5 secondsBạn cũng có thể sử dụng JavaScript để tự động làm mới trang web sau một khoảng thời gian xác định. Sử dụng phương thức setTimeout() ở đây, chúng tôi sẽ tự động làm mới trang 5 giây sau khi tải lại
3. Làm mới trang khi nhấp vào nút
Page Reload Uisng Javascript on button clickThay vì tự động làm mới trang web bằng một phương thức, bạn có thể gọi phương thức đó khi người dùng thực hiện một sự kiện, chẳng hạn như nhấp vào nút. Trong ví dụ này, bạn có thể thấy trang đó sẽ được làm mới bằng cách sử dụng vị trí. reload() sau khi người dùng nhấp vào nút Tải lại trang
4. Sử dụng Chức năng Lịch sử
Thí dụ
Page Reload Uisng Javascriptusing history functionJavaScript, đối tượng cửa sổ có thuộc tính lịch sử được sử dụng để làm mới trang. Lịch sử. phương thức go() trong ví dụ này giúp thao tác lịch sử phiên trình duyệt
Ở đây 0 là tham số lịch sử,
- 0 = Trang hiện tại
- -1 = Trang trước
Tham số này cho phép bạn điều hướng qua lại trong lịch sử phiên trang web của mình
5. Làm mới trang trong HTML
Page Reload Uisng meta tagMã sẽ làm mới tài liệu HTML sau mỗi 1 giây. Tương đương http được đặt thành làm mới và thuộc tính nội dung được đặt thành khoảng thời gian 1 giây.
6. Sử dụng Jquery
Page Reload Uisng JqueryCửa sổ. vị trí có thuộc tính href. Điều này trả về URL của trang web hiện tại. Trong ví dụ này, thuộc tính này được sử dụng để tải lại và làm mới trang hiện tại. Thuộc tính này cũng có thể được sử dụng để nhắm mục tiêu một trang khác và làm mới nó