js导入html自制路由器电源线,用js写的一个路由(简单实例)

前几天在网上看了一个大牛用js写了一个路由的,有一句代码一直不知道怎么回事,后来就自己写了一个,写的比较的粗糙,我觉得把面向对象的思想都搞得乱七八糟的,不过功能实现了。

js实现路由

< a href=" " >white a>

< a href="#/green" >green a>

< a href="#/blue" >blue a>

< a href="#/yellow" >yellow a>

function Route(){

}

Route.prototype.open=function(route,callback){

var arr={};

arr[route]=callback;

window.addEventListener('hashchange',function(){

var temp=window.location.hash;

for(var i in arr){

if(i==temp.slice(1,temp.length)){

arr[i]();

}

}

})

}

window.Route=new Route();

function change(color){

var body=document.getElementsByTagName('body')[0];

body.style.backgroundColor=color;

console.log(color);

}

Route.open('/',function(){

change('');

});

Route.open('/green',function(){

change('green');

});

Route.open('/blue',function(){

change('blue');

});

Route.open('/yellow',function(){

change('yellow');

});

以上就是小编为大家带来的用js写的一个路由(简单实例)的全部内容了，希望对大家有所帮助，多多支持脚本之家~