如何用JavaScript检测离线/在线状态_WEB前端开发

如何用JavaScript检测离线/在线状态_WEB前端开发,第1张

css中标签嵌套规则有哪些_WEB前端开发

css快速入门:本文为大家介绍了css中的标签嵌套规则,具有一定的参考意义,希望可以帮助到大家。


嵌套规则:body可以直接包含块状元素,ins、del、script等不可以直接包含行内元素。


如何用JavaScript检测离线/在线状态_WEB前端开发,第2张

这两年离线浏览技术越来越流行,最常见的就是HTML5移动应用里,有很多普通的Web app也使用了这些技术。


但是,新技术的出现有时会给我们WEB开发人员带领额外的苦恼,比如,如何判断用户现在是在线还是离线?幸好,有矛就有盾,JavaScript里的navigator对象帮我们解决这个问题。


相关学习推荐:javascript视频教程

navigator.onLine

navigator.onLine属性能给我们提供一个布尔值,用来判断用户是否连接了互联网。


你可以这样访问它:

if(navigator.onLine) { // true|false
	// ...
}

没有比这更简单的了!

学习JavaScript地理位置信息API_WEB前端开发

在浏览器里用JavaScript获取地理位置信息API在很多移动应用里是最常见的API运用,作为Web程序员,它应该是你必须具备的一项知识技巧,幸运的是,目前所有流行的浏览器都支持了这种技术。


事件

我们除了能检测这个离线/在线属性值外,还可以绑定offlineonline事件:

function updateIndicator() {
	// 这时可以根据offline/online按钮的颜色
}

// 根据网络连接情况更新在线状态
window.addEventListener('online',  updateIndicator);
window.addEventListener('offline', updateIndicator);
updateIndicator();

当然,老式的技术里也提供了相应的方法,在body标记上使用ononlineonoffline 方法。


我可以想象到很多地方都需要使用这些事件和属性。


比如一种情况,当用户正在工作时,断网了,如果我们的WEB应用可以检测出这种状态,可以将用户的写作保持到本地的Web Storage里,等网络恢复后,再提交到服务器上,这样,断网将不会给用户的写作带来影响。


这只是一个简单的例子,相信你能想出更多。


需要提醒的是,这个API并不是那么可靠。


最古老的定时刷新的技术可以当做一种备案。


以上就是如何用JavaScript检测离线/在线状态的详细内容,更多请关注ki4网其它相关文章!

必备的12个JavaScript技巧_WEB前端开发

在这篇文章中将给大家分享12个有关于JavaScript的小技巧,这些小技巧可能在你的实际工作中或许能帮助你解决一些问题,一起收纳学习吧。


欢迎分享,转载请注明来源:内存溢出

原文地址: http://www.outofmemory.cn/zaji/561835.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2020-07-08
下一篇 2020-07-08

发表评论

登录后才能评论

评论列表(0条)

保存