您好,登錄后才能下訂單哦!
本文小編為大家詳細介紹“js怎么實現無刷新跳轉404頁面不存在效果”,內容詳細,步驟清晰,細節處理妥當,希望這篇“js怎么實現無刷新跳轉404頁面不存在效果”文章能幫助大家解決疑惑,下面跟著小編的思路慢慢深入,一起來學習新知識吧。
html代碼示例如下,注意需要jquery
<!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> <title>測試404頁面不存在</title> <script type="text/javascript" src="https://apps.bdimg.com/libs/jquery/1.11.3/jquery.min.js"></script> <script type="text/javascript">window.Configs={"typeid":1,"id":469};</script> <script> if ("undefined" != typeof window.Configs && (window.Configs.typeid !=2 || window.Configs.id !=469)) { var errHtml = '<div class="error-page-wrap"><em>404</em><h2>\u62b1\u6b49\uff01\u60a8\u8bbf\u95ee\u7684\u9875\u9762\u4e0d\u5b58\u5728</h2><p>\u00b7\u8be5\u9875\u9762\u53ef\u80fd\u5df2\u7ecf\u5220\u9664\u6216\u66f4\u540d \u00b7\u8bf7\u68c0\u67e5\u8f93\u5165\u7684\u5730\u5740\u662f\u5426\u6b63\u786e</p><a href="/" class="home404">\u8fd4\u56de\u9996\u9875</a></div>'; (lookupCallEnabled = !1, document.title = "404-\u9875\u9762\u4e0d\u5b58\u5728", jQuery("html").hide(), jQuery(function(a) { a("body").html(errHtml); a("html").show(); a("body").css("background", "#fff") }) ); } </script> <style> .error-page-wrap{width:100%;background:#ffffff;font-size:13px;margin:40px auto;padding:20px 10px;text-align:center;overflow:hidden} .error-page-wrap a {color:#333;text-decoration:none;} .error-page-wrap em{width:225px;height:45px;margin:0 auto;text-indent:-999em;display:inline-block;overflow:hidden;background:url(/static/image/logo404.png) no-repeat;} .error-page-wrap h2{font-size:24px;color:#c71508;font-family:'Microsoft Yahei', Georgia;margin:10px 0 20px ;} .error-page-wrap p{line-height:28px;} .error-page-wrap .home404{width:92px;line-height:28px;height:28px;display:inline-block;border-radius:3px;background:#2A9325;font-weight:bold;color:#fff;text-align:center;margin:15px 0 0 6px;overflow:hidden;cursor:pointer;} </style> </head> <body> <div>js(jquery)實現無刷新跳轉404頁面不存在效果</div> </body> </html>
代碼講解:
1. https://apps.bdimg.com/libs/jquery/1.11.3/jquery.min.js——是百度的jquery靜態資源,穩定高速;
2. window.Configs={"typeid":1,"id":469}; ——程序調出分類typeid值,文章id值;
3. "undefined" != typeof window.Configs——判斷window.Configs是否存在,未定義返回"undefined";
4. window.Configs.typeid !=2 || window.Configs.id !=469——分類typeid值不等于2或者文章id值不等于469,根據實際情況,這里可以使用多種匹配;
5. errHtml——定義的頁面展示HTML代碼;
6. document.title——標題;
隱蔽使用:
可以把js代碼藏到其他js文件中,或者js加密等等。
讀到這里,這篇“js怎么實現無刷新跳轉404頁面不存在效果”文章已經介紹完畢,想要掌握這篇文章的知識點還需要大家自己動手實踐使用過才能領會,如果想了解更多相關內容的文章,歡迎關注億速云行業資訊頻道。
免責聲明:本站發布的內容(圖片、視頻和文字)以原創、轉載和分享為主,文章觀點不代表本網站立場,如果涉及侵權請聯系站長郵箱:is@yisu.com進行舉報,并提供相關證據,一經查實,將立刻刪除涉嫌侵權內容。