比较有意思的，部分HTMl5事件

1.contexmenu事件

单击鼠标右键，出现上下文菜单，可以结合event对象的，clientX与clientY属性，制作一个自定义的上下文菜单。

contexmenu事件是冒泡的，只要给docment指定一个事件处理程序，就可以在页面上所有的地方上使用该事件。
event.preventDefault(),可以取消浏览器默认的上下文菜单
例子：自己再加点CSS的话，就会更漂亮
HTML部分

<div id="mydiv">我代表页面上的任何元素</div>
<ul id="myMenu" style="postion:absolute; visibility:hidden; background-color:red">
	<li>新增</li>
	<li>编辑</li>
	<li>删除</li>
</ul>

JS部分

window.addEventLinstenner("load", (event) =>{
	// 去掉div元素的默认上下文菜单
	let div = docment.getElementById("mydiv");
	div.addEventLinstenner("contexmenu", (event) =>{
		event.preventDefault();
		// 给自定义上下文菜单添加位置与是否显示
		let menu = docment.getElementById("myMenu");
		menu.style.left = event.clientX + "px";
		menu.style.right = event.clientY + "px";
		menu.style.visibility = "visible";
	});
	//点击别的地方时，隐藏上下文（系统上下文就是这么隐藏的）
	document.addEventLinstener("click", (event) =>{
		docment.getElementById("myMenu").style.visibility = "hidden";
	})
})

2.beforeunload事件

这个事件会在window上触发，用意是给开发者阻止页面被卸载的机会，这个事件会在页面被浏览器关闭时出发，会出现一个选择框，点击确认关闭当前页面，取消则不关闭。

window.addEventListenner("beforeunload", (event) =>{
	let message = "你确定这样做吗？"
	event.returnValue = message //对于ie与firefox要设置event.returnValue
	return message //对于chrome与safari要返回一个message值 
})

3.hashchange事件

用于在URL散列值（URL最后#后面的部分）发生变化时通知开发者

window.addEventListenner("hashchange", (event) =>{
	console.log(`旧的URL：${event.oldURL}, 新的URL:${newURL}`)
	//如果要确认当前散列值，最好使用locaction对象
	console.log(`当前的URL：${location。hash}`)
})