溫馨提示×

您好,登錄后才能下訂單哦!

密碼登錄×
登錄注冊(cè)×
其他方式登錄
點(diǎn)擊 登錄注冊(cè) 即表示同意《億速云用戶服務(wù)條款》

js怎么實(shí)現(xiàn)無(wú)刷新跳轉(zhuǎn)404頁(yè)面不存在效果

發(fā)布時(shí)間:2023-05-06 15:35:53 來(lái)源:億速云 閱讀:245 作者:iii 欄目:開(kāi)發(fā)技術(shù)

本文小編為大家詳細(xì)介紹“js怎么實(shí)現(xiàn)無(wú)刷新跳轉(zhuǎn)404頁(yè)面不存在效果”,內(nèi)容詳細(xì),步驟清晰,細(xì)節(jié)處理妥當(dāng),希望這篇“js怎么實(shí)現(xiàn)無(wú)刷新跳轉(zhuǎn)404頁(yè)面不存在效果”文章能幫助大家解決疑惑,下面跟著小編的思路慢慢深入,一起來(lái)學(xué)習(xí)新知識(shí)吧。

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>測(cè)試404頁(yè)面不存在</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)實(shí)現(xiàn)無(wú)刷新跳轉(zhuǎn)404頁(yè)面不存在效果</div>
</body>
</html>

代碼講解:

1. https://apps.bdimg.com/libs/jquery/1.11.3/jquery.min.js&mdash;&mdash;是百度的jquery靜態(tài)資源,穩(wěn)定高速;

2. window.Configs={"typeid":1,"id":469}; &mdash;&mdash;程序調(diào)出分類typeid值,文章id值;

3. "undefined" != typeof window.Configs&mdash;&mdash;判斷window.Configs是否存在,未定義返回"undefined";

4. window.Configs.typeid !=2 || window.Configs.id !=469&mdash;&mdash;分類typeid值不等于2或者文章id值不等于469,根據(jù)實(shí)際情況,這里可以使用多種匹配;

5. errHtml&mdash;&mdash;定義的頁(yè)面展示HTML代碼;

6. document.title&mdash;&mdash;標(biāo)題;

隱蔽使用:

可以把js代碼藏到其他js文件中,或者js加密等等。

讀到這里,這篇“js怎么實(shí)現(xiàn)無(wú)刷新跳轉(zhuǎn)404頁(yè)面不存在效果”文章已經(jīng)介紹完畢,想要掌握這篇文章的知識(shí)點(diǎn)還需要大家自己動(dòng)手實(shí)踐使用過(guò)才能領(lǐng)會(huì),如果想了解更多相關(guān)內(nèi)容的文章,歡迎關(guān)注億速云行業(yè)資訊頻道。

向AI問(wèn)一下細(xì)節(jié)

免責(zé)聲明:本站發(fā)布的內(nèi)容(圖片、視頻和文字)以原創(chuàng)、轉(zhuǎn)載和分享為主,文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng),如果涉及侵權(quán)請(qǐng)聯(lián)系站長(zhǎng)郵箱:is@yisu.com進(jìn)行舉報(bào),并提供相關(guān)證據(jù),一經(jīng)查實(shí),將立刻刪除涉嫌侵權(quán)內(nèi)容。

js
AI