HTML之onhashchange

HTML之onhashchange.pdf 

1.        onhashchange介绍

onhashchange是HTML5的特性，当前主流的新版本浏览器都支持，但IE7、IE6不支持。

对于一个URL，如：http://aquester.cublog.cn#abc123，“#”后面的abc123即为hash内容，当它发生变化时，即会触发onhashchange事件，即使仅由http://aquester.cublog.cn变成http://aquester.cublog.cn#也会触发onhashchange事件。触发的方式可以是代码中改变，也可以是浏览器URL地址栏手工（Chrome中需要敲回车键）改变。

 

可以使用“if ("onhashchange" in window) {”来检测浏览器是否支持onhashchange特性。

 

安插onhashchange的两种方式：

1)       作为的属性

onhashchange="onchange()">

 

这种方式下，onchange()函数的定义位置没有要求，可以在 段，也可以在段，也可以放在段之后。

2)       作为windows对象的属性值

    if ("onhashchange" in window) {

        window.onhashchange = onchange;

    }

 

从上可以看出，onhashchange是window对象的属性。

在这种方式下，onchange()函数的定义位置需要位于“window.onhashchange = onchange;”语句之前，如：

2.        如何触发onhashchange？

只需要修改localtion.hash，即会触发onhashchange，如：

 

onhashchange="onchange()">

   

123

    Click Me!

 

 

附1：JS脚本安插在段和段的区别是什么？

答：安插在段时，会提前加载，按需加载就放到或之后，加载顺序是：先段 -> 段 -> 之后。

 

附2：location介绍

可以将location简单理解成浏览器的地址栏，它有多个属性，可以浏览https://developer.mozilla.org/zh-CN/docs/Web/API/Location加以了解，常见的如：

location属性名	location属性说明
href	完整的URL，包括#部分
hash	仅指URL的#部分
protocol	协议名称，如：http:，注意包括了一个冒号
host	URL的域名部分，如：aquester.cublog.cn
pathname	URL的域名之后的部分，如：http://aquester.cublog.cn/index.html中的“/index.html”为pathname，总是以“/”打头。

 

可以通过下面这样的代码来体验location各属性的值：

   

 

提问：HTML中的document和windows有何区别？