HTML5提供了新的history接口,例如pushstate,以及popstate。通常情況下,瀏覽器的歷史記錄能保存訪問歷史,但是因為有了history api,pushstate和replacestate,我們甚至可以“偷換掉”瀏覽器的歷史記錄,偷走后退按鈕,讓瀏覽者點(diǎn)按“后退按鈕”時,到一個你指定的網(wǎng)頁,看起來就像是真的后退歷史記錄一樣!這個網(wǎng)頁還可以跨域,而且就算不存在向前d歷史記錄也能創(chuàng)建。有什么好處呢?想讓訪客更多的留在你的網(wǎng)站上?想要……?
?
用history api"偷走"瀏覽器后退按鈕
實(shí)現(xiàn)代碼如下:
?
第一步,創(chuàng)建一個歷史
這一步創(chuàng)建一個帶有 hash 的歷史,方便popstate監(jiān)聽.
?
第二步,監(jiān)聽并跳轉(zhuǎn)
當(dāng)按下后退按鈕時,檢查到有#!/stealingyourhistory的hash時,則利用setTimeout函數(shù)來跳轉(zhuǎn)到你指定的網(wǎng)頁,例如設(shè)計為按下后退按鈕后,不是返回上一個歷史記錄而是到博客主頁
全部實(shí)現(xiàn)代碼如下
(function(window, location) { history.replaceState(null, document.title, location.pathname+"#!/stealingyourhistory"); history.pushState(null, document.title, location.pathname); window.addEventListener("popstate", function() { if(location.hash === "#!/stealingyourhistory") { history.replaceState(null, document.title, location.pathname); setTimeout(function(){ location.replace("http://blog.netsh.org/"); },0); } }, false); }(window, location));
?
"偷換"瀏覽器后退歷史記錄 Demo
如果想要實(shí)實(shí)在在地看一個Demo, 按此 。
這樣一來,你就可以“偷走”瀏覽器的后退歷史記錄,當(dāng)按下后退按鈕,不會后退,而是到你指定的某個網(wǎng)頁了。
不過如果你想用這個方式增加PV或者做什么壞事的話,確實(shí)不友好哦。
?
原文: http://blog.netsh.org/posts/history-stealing_1593.netsh.html
?
?
更多文章、技術(shù)交流、商務(wù)合作、聯(lián)系博主
微信掃碼或搜索:z360901061

微信掃一掃加我為好友
QQ號聯(lián)系: 360901061
您的支持是博主寫作最大的動力,如果您喜歡我的文章,感覺我的文章對您有幫助,請用微信掃描下面二維碼支持博主2元、5元、10元、20元等您想捐的金額吧,狠狠點(diǎn)擊下面給點(diǎn)支持吧,站長非常感激您!手機(jī)微信長按不能支付解決辦法:請將微信支付二維碼保存到相冊,切換到微信,然后點(diǎn)擊微信右上角掃一掃功能,選擇支付二維碼完成支付。
【本文對您有幫助就好】元
