JS實(shí)現(xiàn)簡單路由器功能的方法
本文實(shí)例講述了JS實(shí)現(xiàn)簡單路由器功能的方法。分享給大家供大家參考。具體實(shí)現(xiàn)方法如下:
var wawa = {}; wawa.Router = function(){ function Router(){ } Router.prototype.setup = function(routemap, defaultFunc){ var that = this, rule, func; this.routemap = []; this.defaultFunc = defaultFunc; for (var rule in routemap) { if (!routemap.hasOwnProperty(rule)) continue; that.routemap.push({ rule: new RegExp(rule, 'i'), func: routemap[rule] }); } }; Router.prototype.start = function(){ console.log(window.location.hash); var hash = location.hash, route, matchResult; for (var routeIndex in this.routemap){ route = this.routemap[routeIndex]; matchResult = hash.match(route.rule); if (matchResult){ route.func.apply(window, matchResult.slice(1)); return; } } this.defaultFunc(); }; return Router; }(); var router = new wawa.Router(); router.setup({ '#/list/(.*)/(.*)': function(cate, id){ console.log('list', cate, id); }, '#/show/(.*)': function(id){ console.log('show', id); } }, function(){ console.log('default router'); }); router.start();
希望本文所述對(duì)大家的javascript程序設(shè)計(jì)有所幫助。
- 用director.js實(shí)現(xiàn)前端路由使用實(shí)例
- director.js實(shí)現(xiàn)前端路由使用實(shí)例
- vue.js使用watch監(jiān)聽路由變化的方法
- VueJs路由跳轉(zhuǎn)——vue-router的使用詳解
- AngularJS路由實(shí)現(xiàn)頁面跳轉(zhuǎn)實(shí)例
- AngularJS 路由詳解和簡單實(shí)例
- react-router JS 控制路由跳轉(zhuǎn)實(shí)例
- 使用AngularJS對(duì)路由進(jìn)行安全性處理的方法
- AngularJS監(jiān)聽路由的變化示例代碼
- JS實(shí)現(xiàn)前端路由功能示例【原生路由】
相關(guān)文章
學(xué)習(xí)JavaScript設(shè)計(jì)模式之單例模式
這篇文章主要為大家介紹了JavaScript設(shè)計(jì)模式中的單例模式,對(duì)JavaScript設(shè)計(jì)模式感興趣的小伙伴們可以參考一下2016-01-01一個(gè)簡單的彈性返回頂部JS代碼實(shí)現(xiàn)介紹
頁面滾動(dòng)條處于低端,點(diǎn)擊回到頂部,并且隱藏掉,具體實(shí)現(xiàn)代碼如下,感興趣的朋友可以參考下哈2013-06-06js實(shí)現(xiàn)圖片切換(動(dòng)畫版)
本文主要對(duì)javascript實(shí)現(xiàn)圖片切換(動(dòng)畫版)的方法進(jìn)行步驟分析、實(shí)例介紹,具有很好的參考價(jià)值,需要的朋友一起來看下吧2016-12-12微信小程序如何實(shí)現(xiàn)radio單選框單擊打勾和取消
這篇文章主要介紹了微信小程序如何實(shí)現(xiàn)radio單選框單擊打勾和取消,文中通過示例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友可以參考下2020-01-01基于JS實(shí)現(xiàn)EOS隱藏錯(cuò)誤提示層代碼
本文給大家分享一段代碼基于js實(shí)現(xiàn)EOS隱藏錯(cuò)誤提示層,對(duì)eos隱藏提示層的相關(guān)知識(shí)感興趣的朋友一起學(xué)習(xí)吧2016-04-04原生JS實(shí)現(xiàn)網(wǎng)頁手機(jī)音樂播放器 歌詞同步播放的示例
下面小編就為大家分享一篇原生JS實(shí)現(xiàn)網(wǎng)頁手機(jī)音樂播放器 歌詞同步播放的示例,具有很好的參考價(jià)值,希望對(duì)大家有所幫助。一起跟隨小編過來看看吧2018-02-02bootstrapTable+ajax加載數(shù)據(jù) refresh更新數(shù)據(jù)
這篇文章主要為大家詳細(xì)介紹了bootstrapTable+ajax加載數(shù)據(jù),以及refresh更新數(shù)據(jù),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2018-08-08js或css實(shí)現(xiàn)滾動(dòng)廣告的幾種方案
今天無事逛網(wǎng),突然發(fā)現(xiàn)了一個(gè)很有趣的事情,(也許只有我覺得有趣).我看到一圖片竟然在我拖動(dòng)滾動(dòng)條的時(shí)候沒有動(dòng),也許你會(huì)說我少見多怪,不信你去找個(gè)這樣的我看看,很少有的,一般的都是一拖動(dòng)圖片就在那跳得厲害。2010-01-01輕松實(shí)現(xiàn)js彈框顯示選項(xiàng)
這篇文章主要為大家詳細(xì)介紹了js輕松實(shí)現(xiàn)彈框顯示選項(xiàng)效果,具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2016-09-09