数据结构
网络
RDBMS
操作系统
Java
MS Excel
iOS
HTML
CSS
Android
Python
C 编程
C++
C#
MongoDB
MySQL
Javascript
PHP
物理学
化学
生物学
数学
英语
经济学
心理学
社会学
时尚研究
法律研究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;
}
更新日期： 2021 年 2 月 19 日
110 次浏览
广告