页面一：
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>网络在线与离线</title> <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
</head>
<body><p><a href="one.html" onclick="goNext()">这是index页面</a></p>
<div id="status"></div><!--这个方法是用来跳转下一页的--><script> function goNext(){ //前进下一页 window.history.go(1) }</script>
<!--这个是用来测试有没有网络js 对你来说没啥用 就是检测网络的--><script type="text/javascript" language="javascript" charset="utf-8">
$$=function(id){return document.getElementById(id);};
if(navigator.onLine){$$("status").innerHTML="第一次加载时在线";}else{$$("status").innerHTML="第一次加载时离线";}
window.addEventListener("online",online,false);
function online(){$$("status").innerHTML="on";}
window.addEventListener("offline",offline,false);
function offline(){$$("status").innerHTML="off";}
</script>
</body>
</html>
第二个页面：
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>two</title> <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0"></head><body><p onclick="goBack()">返回上一个页面</p><p>这是第二个页面</p><!--这个方法是用来返回上一页的--><script> function goBack(){ window.history.go(-1) }</script></body></html>
当连网时，你打开了第一个页面以及第二个页面，当忽然断网时，你本身处在第二个页面，点击<p>"返回上一个页面"按钮时，可以返回到历史纪录的第一个页面，并且再次点击第一个页面的<p>"这是index页面"按钮时，也可以跳转到已经记录过的第二个页面。
时间： 2024-10-25 19:54:38