两个知识点
1，window 的 hashchange事件监听
2，Object的defineProperty属性
要在服务器环境中测试
index.html,代码如下：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<script type="text/javascript" src="/router.js"> </script>
</head>
<body>
<button type="button" onclick="aa()">click</button>
<div id="staticJS">
</div>
</body>
</html>
<script type="text/javascript">
let x =location.href
//location.href = x+"/#/a"
/*Router.name="gao"
alert(Router.name)
console.log(Router)
console.log(Router.getURL())*/
function aa(){
location.href = 'http://127.0.0.1:8080/index.html/'+"#/b"
}
</script>router.js代码如下：
(function(W){
function Router(){
this._path = "" ;
//this.current_url = "" ;
this.getURL = function(){
return W.location.hash.substring(1)
}
}
Object.defineProperty(Router.prototype,'path',{
configurable: true,
enumerable: true,
get:function(){
return this._path;
},
set:function(val){
this._path = val;
this.wathchash();
}
})
Router.prototype.wathchash = function(){
console.log("hash 监听 当前HASH" + this._path)
/*let z = "http://127.0.0.1:80/tp/public/vuecomponents/myplugin/index.js"
let script = document.createElement("script")
script.src = z;
document.getElementById("staticJS").appendChild(script);
script.onload=function(){
alert("加载完毕")
}*/
}
Router.prototype.init = function(){
let t = this;
W.addEventListener("hashchange",function(e){
let n = t.getURL();
t.path = n;
},false)
}
W.Router = new Router();
W.Router.init();
})(window)
/*
1,
*/
51
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
