How JavaScript reloads (refreshes) a page-JS Tutorial-php.cn

Home

Web Front-end

JS Tutorial

How JavaScript reloads (refreshes) a page

青灯夜游

Nov 20, 2018 pm 05:10 PM

javascript

The content of this article is to introduce how to reload (refresh) the page using JavaScript. It has certain reference value. Friends in need can refer to it. I hope it will be helpful to you.

There are several ways to reload or refresh an HTML page in JavaScript, but the standard way to do the job is to use the window.location object. This article will introduce to you how to use the window.location object to reload (refresh) the page.

A reload() method is provided in the window.location object, which instructs the browser to reload the page. The browser can do this from its cache or the server, depending on the optional parameters, i.e. reload(true) will reload the page from the server, reload(false) will only reload the page from the browser's cache.

Below we will introduce the method of JavaScript reloading (refreshing) the page through a simple code example.

In the example, we will introduce using jQuery and JavaScript to reload the page from the server and browser's cache.

In our HTML, there are two buttons, one to reload the page from the server and the other to refresh the page from the browser cache. While location.reload() works in all browsers, you can also use jQuery to wrap other code, such as attaching click handlers to two buttons.

Sample code:

<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<title>使用jQuery和JavaScript重新加载(刷新)页面</title>
		<script type="text/javascript" src="query.min.js" ></script>
	</head>

	<body>
		<h2 id="如何使用jQuery和JavaScript重新加载-刷新-页面">如何使用jQuery和JavaScript重新加载(刷新)页面</h2>

		<button id="btn_reload">从服务器重新加载</button>
		<button id="btn_refresh">从浏览器的缓存中重新加载</button>
		<script>
			$(document).ready(function(){
				$("#btn_refresh").click(function() {
					location.reload(false); //从浏览器的缓存加载 
				});
				$("#btn_reload").click(function() {
					location.reload(true); //从服务器加载
				});
			});
		</script>

	</body>

</html>

Rendering:

How JavaScript reloads (refreshes) a page

Note:

window.location.reload() will Instructs the browser to reload the page, which means the data will be re-downloaded from the server, parsed and displayed. You can also reload the page from the browser's cache using the location.reload(false) method.

By the way, you can also use history.go(0) and location.replcace(locatoin.pathname) to reload the page.

The above is the entire content of this article, I hope it will be helpful to everyone's study. Recommended more related video tutorials: jQuery Tutorial!

The above is the detailed content of How JavaScript reloads (refreshes) a page. For more information, please follow other related articles on the PHP Chinese website!

Statement

The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn