使用JavaScript获取电池状态的方法


Posted in Javascript onMay 03, 2014

从Mozilla Aurora 11起,火狐浏览器里实现了一些新功能,其中一个就是对电池状态接口的基本实现。这个很简单的接口能提供你关于电池当前电量,是否在充电等信息,以及一些电池状态变化事件。让我们来看看效果!

电池对象是存放在window.navigator.battery里,但因为这是火狐浏览器首次实现并提供这个接口,并未普及,你需要使用window.navigator.mozBattery这种写法。这个mozBattery对象有下列属性:

1.charging: 表示当前电池设备是否在充电。如果电池没有充电,这个值为false。如果为true,表明电池正在充电。当前的API实现里不能得到是否充满的信息,也无法判断当前设备是否有电池。
2.chargingTime: 是指距离电池充满还需要多久。
3.dischargingTime: 电池已使用时间。
4.level: 表示电量等级,从0到1.0。当这个值为0时,表示电量耗尽,系统即将关机。如果为1.0,则表示电池满电。
针对这些状态,接口里提供了各自相应的事件,包括onchargingchange, onchargingtimechange, ondischargingtimechange, 和 onlevelchange。基本的用法很简单:

// 获取电池对象!
var battery = navigator.battery || navigator.webkitBattery || navigator.mozBattery;
// 显示一些有用属性值
console.warn("电池充电状态: ", battery.charging); // true
console.warn("电量水平: ", battery.level); // 0.58
console.warn("电池使用时间: ", battery.dischargingTime);
// 设置一些事件监听器
battery.addEventListener("chargingchange", function(e) {
 console.warn("电池充电状态变化: ", battery.charging);
}, false);
battery.addEventListener("chargingtimechange", function(e) {
 console.warn("电池充电时间变化: ", battery.chargingTime);
}, false);
battery.addEventListener("dischargingtimechange", function(e) {
 console.warn("电池使用时间变化: ", battery.dischargingTime);
}, false);
battery.addEventListener("levelchange", function(e) {
 console.warn("电量水平变化: ", battery.level);
}, false);

很简单,不是吗?这几个接口都非常的棒:简单,高效,实用!

为什么要使用这些电池编程接口?因为很多用浏览器封装的移动应用(非‘native')需要知道系统的当前状态。有些CPU对电量很敏感,在处理某些特殊任务前要设备有足够的电量,App应事先提醒用户电量不足,请充电。

Javascript 相关文章推荐
javascript 字符串连接的性能问题(多浏览器)
Nov 18 Javascript
jQuery源码分析之Event事件分析
Jun 07 Javascript
js里的prototype使用示例
Nov 19 Javascript
原生js实现查找/添加/删除/指定元素的class
Apr 12 Javascript
Jquery 的outerHeight方法使用介绍
Sep 11 Javascript
js获取字符串最后一位方法汇总
Nov 13 Javascript
js实现获取两个日期之间所有日期的方法
Jun 17 Javascript
jquery实现刷新随机变化样式特效(tag标签样式)
Feb 03 Javascript
微信小程序 sha1 实现密码加密实例详解
Jul 06 Javascript
AngularJs+Bootstrap实现漂亮的计算器
Aug 10 Javascript
浅谈vue-router 路由传参的方法
Dec 27 Javascript
详解Vue.js和layui日期控件冲突问题解决办法
Jul 25 Javascript
JavaScript打印网页指定区域的例子
May 03 #Javascript
js检测输入内容全为空格的方法
May 03 #Javascript
JS兼容浏览器的导出Excel(CSV)文件的方法
May 03 #Javascript
离开当前页面前使用js判断条件提示是否要离开页面
May 02 #Javascript
js日期联动示例
May 02 #Javascript
jQuery实现的多选框多级联动插件
May 02 #Javascript
自己使用js/jquery写的一个定制对话框控件
May 02 #Javascript
You might like
完美解决:Apache启动问题―(OS 10022)提供了一个无效的参数
2013/06/08 PHP
调用WordPress函数统计文章访问量及PHP原生计数器的实现
2016/03/21 PHP
特殊字符、常规符号及其代码对照表
2006/06/26 Javascript
在线编辑器的实现原理(兼容IE和FireFox)
2007/03/09 Javascript
xml 与javascript结合的问题解决方法
2007/03/24 Javascript
Javascript学习笔记9 prototype封装继承
2010/01/11 Javascript
高效的表格行背景隔行变色及选定高亮的JS代码
2010/12/04 Javascript
点击页面其它地方隐藏该div的两种思路
2013/11/18 Javascript
js中一个函数获取另一个函数返回值问题探讨
2013/11/21 Javascript
JS+DIV实现鼠标划过切换层效果的实例代码
2013/11/26 Javascript
基于OL2实现百度地图ABCD marker的效果
2015/10/01 Javascript
JS实现的仿淘宝交易倒计时效果
2015/11/27 Javascript
详解js中构造流程图的核心技术JsPlumb(2)
2015/12/08 Javascript
flag和jq on 的绑定多个对象和方法(必看)
2017/02/27 Javascript
用vue的双向绑定简单实现一个todo-list的示例代码
2017/08/03 Javascript
bootstrap-table实现服务器分页的示例 (spring 后台)
2017/09/01 Javascript
JS的Ajax与后端交互数据的实例
2018/08/08 Javascript
Vue $emit $refs子父组件间方法的调用实例
2018/09/12 Javascript
js实现延迟加载的几种方法详解
2019/01/19 Javascript
详解Angular Karma测试的持续集成实践
2019/11/15 Javascript
React+EggJs实现断点续传的示例代码
2020/07/07 Javascript
Python中文分词工具之结巴分词用法实例总结【经典案例】
2017/04/15 Python
python3+PyQt5 使用三种不同的简便项窗口部件显示数据的方法
2019/06/17 Python
python通过移动端访问查看电脑界面
2020/01/06 Python
Python的pygame安装教程详解
2020/02/10 Python
在python3中实现更新界面
2020/02/21 Python
python实现简单井字棋游戏
2020/03/04 Python
150行Python代码实现带界面的数独游戏
2020/04/04 Python
Steve Madden官网:美国鞋类品牌
2017/01/29 全球购物
Europcar意大利:汽车租赁
2019/07/07 全球购物
中学生校园广播稿
2014/01/16 职场文书
护理专科毕业自荐信范文
2014/04/21 职场文书
贵阳市党的群众路线教育实践活动党(工)委领导班子整改方案
2014/10/26 职场文书
导游词300字
2015/02/13 职场文书
Python基础之条件语句详解
2021/06/16 Python
JavaScript实现音乐播放器
2022/08/14 Javascript