[HTML 5] Page Visibility API
2023-09-14 08:59:12 时间
const initPageVisibility = () => {
setInterval(() => console.log(document.visibilityState), 1000)
}
if ('visibilityState' in document) {
initPageVisibility()
}
If you click other tab, the current tab should be in `hidden` state, otherwise will be in `visible` state.
visibilitychange event
const initPageVisibility = () => {
const handleVisibilityChange = () => {
console.log(e.target.visibilityState); // the same
console.log(document.visibilityState); // the same
const {visibilityState} = e.target;
switch(visibilityState) {
case 'hidden': {
console.log('document is hidden!')
break;
}
case 'visibile': {
console.log('document is visible!')
break;
}
}
}
document.addEventListener('visibilitychange', handleVisibilityChange);
}
if ('visibilityState' in document) {
initPageVisibility()
}
相关文章
- HTML入门教程_html代码基础
- 用html做简单的日记,学习HTML日记[通俗易懂]
- HTML上document的方法
- html屏蔽右键、禁止复制与禁止查看源代码的几种方法
- html中如何写系统时间,在HTML页面获取当前系统时间
- html5div居中属性,html怎样让div居中
- html输入框无法输入
- HTML + CSS + JS 利用邮编查询 API 实现邮编查询工具
- Linux图形界面API:开启简单而强大的开发之旅(linux图形界面api)
- MySQL数据库中如何存储和检索带有HTML标签的文本(mysql中html标签)
- API实现MySQL数据库备份(api备份mysql)
- MySQL的API关闭全面调控(api关闭mysql)
- HTML与Oracle开启精彩的互联网之旅(html和oracle)
- ScriptHtml函数之过滤html标记的asp代码
- html工作中表格<tbody>标签的使用技巧
- 放弃用你的InnerHTML来输出HTML吧jQueryTmpl不详细讲解
- javascript操作html控件实例(javascript添加html)
- phpQuery让php处理html代码像jQuery一样方便