第一种：
使用思路，online属性是一个只读的布尔值，声明了系统是否处于脱机模式。
function isOnLine() { var netStatus = ""; if (window.navigator.onLine == true) { netStatus = "onLine";//网络链接正常 } else { netStatus = "offLine";//网络连接失败 }; return netStatus; };
调用方法 isOnLine() // onLine 网络在线
调用方法 isOnLine() // offLine 网络离线
但是，此方法存在问题，向我们使用的内网，虽然插网线，但是连接不了互联网，但是依然返回onLine 所以在内网情况下不适用。
第二种：
使用思路，加载一张网络图片，例如百度图标，加载失败的话提示网络链接异常，但是此方法加载速度过慢，代码如下：
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>测试网络是否在线</title> </head> <body> <img id="img-test" style="display:none;" onerror="getImgError()"/> <script> window.onload = function() { var imgPath = "https://www.baidu.com/img/bd_logo1.png"; var timeStamp = Date.parse(new Date()); var imgTest = document.getElementById("img-test"); imgTest.setAttribute("src", imgPath + "?timestamp=" + timeStamp); getImgError = function () { alert("网络连接异常") } } </script> </body> </html>
图片响应会时间过慢，加载会有一定影响，暂时还未很好的解决。。。
原文：https://www.cnblogs.com/CooLLYP/p/14780797.html