1.為什么用前端路由
- 傳統(tǒng)web為服務(wù)端處理來自瀏覽器的請求時已日，根據(jù)不同的url拼接處對應(yīng)的視圖頁面挪凑，通過http返回給瀏覽器進(jìn)行解析渲染玖喘。
- 在web2.0的時代澎办，應(yīng)該講服務(wù)端把中心放在實現(xiàn)核心數(shù)據(jù)處理路基和維護(hù)數(shù)據(jù)庫纺酸，將部分?jǐn)?shù)據(jù)交互和業(yè)務(wù)邏輯交給前端來負(fù)責(zé)窖逗，讓前端來分擔(dān)服務(wù)端的壓力。
路由系統(tǒng)的作用主要是通過記錄URL來記錄web頁面板塊上ajax的變化
2.history API
- history.pushState(data,title,url) //向瀏覽器歷史棧中添加一條記錄
- history.replaceState(data,title,url) //替換瀏覽器歷史棧中當(dāng)前記錄
注意：大多數(shù)瀏覽器會忽略title參數(shù)餐蔬，可以不用指定
都會操作瀏覽器的歷史棧碎紊，兩個API都會更新或者覆蓋當(dāng)前瀏覽器的title和url為對應(yīng)傳入?yún)?shù)
注意：這兩個API都是不能跨域的，API中的data參數(shù)是一個state對象樊诺，可以通過history.state讀取出當(dāng)前頁面的歷史狀態(tài)仗考。 - popstate事件
不讓瀏覽器頁面刷新的歷史記錄之間切換才能觸發(fā)，即調(diào)用pushState词爬，replaceState來操作歷史記錄才會觸發(fā)秃嗜。
3.使用URL中的hash部分
- hashchange事件
當(dāng)頁面hash變化時，會觸發(fā)此事件顿膨，hash部分可以引導(dǎo)瀏覽器將這次記錄推入歷史記錄棧頂锅锨，而當(dāng)觸發(fā)hashchange事件時，可以在其事件處理程序中判斷當(dāng)前的hash部分恋沃，調(diào)用相應(yīng)的ajax操作橡类。
對于低版本的IE，只能通過設(shè)置一個interval來不斷輪詢url是否發(fā)生變化芽唇，來判斷是否發(fā)生了類似hashchange事件顾画，同時可以聲明對應(yīng)的事件處理程序。
