HTML DOM HashChangeEvent
HTML DOM HashChangeEvent 是一種型別介面,用於表示對 URL 的 # 部分進行修改時觸發的事件。
屬性
HashChangeEvent 的屬性如下 −
| 屬性 | 說明 |
|---|---|
| newURL | 在 hash 修改後返回文件 URL。 |
| oldURL | 返回在 hash 更改之前的文件 URL |
語法
HashChangeEvent 的語法如下。
event.eventProperty
此處,eventProperty 是上述兩個屬性之一。
示例
讓我們看一個 HashChangeEvent 示例。
<!DOCTYPE html>
<html>
<body onhashchange="showChange(event)">
<h1>HashChangeEvent example</h1>
<p>Change the hash by clicking the below button</p>
<button onclick="changeHash()">CHANGE</button>
<p id="Sample"></p>
<script>
function changeHash() {
location.hash = "NEWHASH";
}
function showChange() {
document.getElementById("Sample").innerHTML = "The url has been changed from " + event.oldURL + " to " + event.newURL;
}
</script>
</body>
</html>輸出
將產生以下輸出 −

單擊 CHANGE 按鈕 −

在上述示例中
我們建立了一個 CHANGE 按鈕,使用者單擊後將執行 changeHash() 方法。
<button onclick="changeHash()">CHANGE</button>
changeHash() 方法將 location 物件的 hash 屬性更改為 “NEWHASH”。location 物件包含有關我們 URL 的資訊 −
function changeHash() {
location.hash = "NEWHASH";
}一旦 hash 更改,與 body 標記關聯的 onhashchange 事件處理函式就會觸發,並將 haschange 事件作為物件傳遞給函式 showChange() −
<body onhashchange="showChange(event)">
showChange() 方法使用收到的 hashchange 事件在帶有 id “sample” 的段落元素中顯示 oldURL 屬性和 newURL 屬性 -
function showChange() {
document.getElementById("Sample").innerHTML = "The url has been changed from " + event.oldURL + " to " + event.newURL;
}
廣告
資料結構
網路
RDBMS
作業系統
Java
iOS
HTML
CSS
Android
Python
C 程式設計
C++
C#
MongoDB
MySQL
Javascript
PHP