javascript基礎（BMO常用物件：history和location）（四十）

厚積薄發2017發表於2017-02-16
JavaScript物件

1.location和history

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<script type="text/javascript">
			
			/*
			 * history
			 * 	- 該物件代表使用者的歷史記錄，通過它可以對歷史記錄進行操作
			 * 		由於隱私的原因該物件只能控制瀏覽器向前或向後翻頁
			 * 	- 它只可以訪問當次（當前會話）的歷史記錄
			 */
			
			window.onload = function(){
				
				//獲取按鈕物件
				var btn01 = document.getElementById("btn01");
				//為btn01繫結一個單擊響應函式
				btn01.onclick = function(){
					
					/*
					 * length
					 * 	- 獲取當次訪問的歷史記錄的數量
					 */
					//alert(history.length);
					
					
					/*
					 * back()
					 * 	- 可以回退到上一個頁面
					 *  - 功能相當於瀏覽器的後退按鈕
					 */
					//history.back();
					
					/*
					 * forward()
					 * 	- 可以跳轉到下一個頁面
					 * 	- 功能相當於瀏覽器的前進按鈕
					 */
					//history.forward();
					
					/*
					 * go()
					 * 	- 可以跳轉到指定的頁面
					 * 	- 需要一個整數作為引數，將會跳轉指定數量的頁面
					 */
					//history.go(-2);
					
					
					/*
					 * location
					 * 	- location表示的是瀏覽器的位址列的資訊
					 * 	- 如果直接輸出location則會返回當前頁面的地址
					 * 	- 如果直接修改location的值，則會使瀏覽器跳轉到指定的頁面
					 * 	
					 */
					
					//alert(location);
					
					//location = "test01.html";
					
					/*
					 * assign()
					 * 	- 可以用來跳轉到指定的頁面
					 * 	- 他需要一個路徑作為引數，將會跳轉到該路徑
					 * 	- 和直接修改location是一樣的
					 * 	- 修改location和使用assign()來跳轉頁面都會生成歷史記錄
					 * 		可以使用回退按鈕回退
					 */
					//location.assign("test02.html");
					//location = "test01.html";
					
					
					/*
					 * replace()
					 * 	- 使用replace()也可以跳轉到其他的頁面，同樣需要一個地址作為引數
					 * 		用法和assign()一樣
					 * 	- 不會生成歷史記錄，不可以回退
					 */
					//location.replace("test02.html");
					
					
					/*
					 * reload()
					 * 	- 可以用來重新整理當前網頁，相當於瀏覽器的重新整理按鈕
					 * 	- 在該方法中可以傳遞一個true，如果傳了true則會強制清空快取屬性網頁
					 */
					location.reload(true);
					
				};
				
			};
			
			
		</script>
	</head>
	<body>
		
		<button id="btn01">點我一下</button>
		
		<input type="text" />
		
	</body>
</html>


相關文章