锐客网

  1. 首页 > it技术 > >

路由

js中路由通常是一种基于监听url中hash值变化完成页面内容更新的技术手段。
传统事件处理方式
$("ul").on("click", "li", function(){
var index = $(this).index();
$("#content div").eq(index).show().siblings("div").hide();
});
//监听hash的变化
1、使用window的onhashchange window.onhashchange = function(e){
var hash = location.hash.substr(1);
router[hash]();
};
2、window.onpopstate
window.onpopstate = function(e){
var hash = location.hash.substr(1);
router[hash]();
};
3、使用计时器不间断监听hash值变化 var lastHash = location.hash.substr(1);
var hashInterval = setInterval(function(){
var hash = location.hash.substr(1);
if(hash != lastHash){
//执行新hash对应的回调
router[hash]();
//更新上一次hash
lastHash = hash;
}
}, 50);
//创建路由表
var router = {
"home": function(){
var script = document.createElement("script");
script.src = "https://www.it610.com/article/home.js";
document.head.appendChild(script);
},
"hot": function(){
$("#hot").show().siblings().hide();
},
"mine": function(){
$("#mine").show().siblings().hide();
}
};
// $(window).trigger("popstate");
var hash = location.hash.substr(1);
【路由】router[hash]();

    推荐阅读


    上一篇：其实你并不重要。

    下一篇：定位是命