navigator的一些冷知识
{
监听屏幕旋转变化接口: orientationchange
orientation.angle : 0 竖屏 , 90 向左横屏 , -90/270 向右横屏 , 180 倒屏
}
screenOrientation: function(){
let self = this;
let orientation = screen.orientation || screen.mozOrientation || screen.msOrientation;
window.addEventListener("onorientationchange" in window ? "orientationchange" : "resize", function() {
self.angle = orientation.angle;
});
},
{
电池状态:navigator.getBattery()
charging:是否充电
chargingTime:还需充电时间
dischargingTime:剩余电量
level:剩余电量百分数
onchargingchange:监听充电状态的改变 --可监听事件
onchargingtimechange:监听充电时间的改变 --可监听事件
ondischargingtimechange: 监听电池可用时间的改变 --可监听事件
onlevelchange:监听剩余电量百分数的改变 --可监听事件
}
getBatteryInfo: function(){
let self = this;
if(navigator.getBattery){
navigator.getBattery().then(function(battery) {
// 判断是否在充电
self.batteryInfo = battery.charging ? `在充电 : 剩余 ${battery.level * 100}%` : `没充电 : 剩余 ${battery.level * 100}%`;
// 电池充电状态改变事件
battery.addEventListener('chargingchange', function(){
self.batteryInfo = battery.charging ? `在充电 : 剩余 ${battery.level * 100}%` : `没充电 : 剩余 ${battery.level * 100}%`;
});
});
}else{
self.batteryInfo = '不支持电池状态接口';
}
},
{
让你的手机震动: window.navigator.vibrate(200)
测试发现只有UC浏览器目前支持
}
vibrateFun: function(){
let self = this;
if( navigator.vibrate ){
navigator.vibrate([500, 500, 500, 500, 500, 500, 500, 500, 500, 500]);
}else{
self.vibrateInfo = "您的设备不支持震动";
}
<!--
// 清除震动
navigator.vibrate(0);
// 持续震动
setInterval(function() {
navigator.vibrate(200);
}, 500);
-->
},
{
当前语言:navigator.language
}
getThisLang:function(){
const langList = ['cn','hk','tw','en','fr'];
const langListLen = langList.length;
const thisLang = (navigator.language || navigator.browserLanguage).toLowerCase();
for( let i = 0; i < langListLen; i++ ){
let lang = langList[i];
if(thisLang.includes(lang)){
return lang
}else {
return 'en'
}
}
}
//返回浏览器的内部名称
window.navigator.appCodeName //返回浏览器版本号
window.navigator.appVersion //获取设备的网络连接信息
window.navigator.onLine //返回用户的位置信息
let geolocation = window.navigator.geolocation
{
var watchID = navigator.geolocation.watchPosition(function(position) {
do_something(position.coords.latitude, position.coords.longitude);
});
} //浏览器 UI 的语言
window.navigator.language //表示网站访客所使用的语言
window.navigator.languages //MediaDevices 该对象可提供对相机和麦克风等媒体输入设备的连接访问,也包括屏幕共享
var mediaDevices = window.navigator.mediaDevices;
mediaDevices.getUserMedia({ audio: true, video: true }).then(function (stream) { }).catch(function (err) { })
navigator的一些冷知识的更多相关文章
- 前端不为人知的一面--前端冷知识集锦 前端已经被玩儿坏了!像console.log()可以向控制台输出图片
前端已经被玩儿坏了!像console.log()可以向控制台输出图片等炫酷的玩意已经不是什么新闻了,像用||操作符给变量赋默认值也是人尽皆知的旧闻了,今天看到Quora上一个帖子,瞬间又GET了好多前 ...
- 前端不为人知的一面–前端冷知识集锦 原文地址(http://web.jobbole.com/83473/);
前端已经被玩儿坏了!像console.log()可以向控制台输出图片等炫酷的玩意已经不是什么新闻了,像用||操作符给变量赋默认值也是人尽皆知的旧闻了,今天看到Quora上一个帖子,瞬间又GET了好多前 ...
- .Net冷知识之动态查找类型时的程序集路径问题
今天就说说.Net中通过反射取得某个类型时,我们怎么知道这个类型在硬盘上的哪个角落?比如说,假如我们需要要求服务端动态载入某个数据源,那服务端怎么知道数据源在哪? 网上大部分的教程都写着,可以使用As ...
- 转:前端冷知识(~~some fun , some useful)
前端不为人知的一面——前端冷知识集锦 前端已经被玩儿坏了!像console.log()可以向控制台输出图片等炫酷的玩意已经不是什么新闻了,像用||操作符给变量赋默认值也是人尽皆知的旧闻了,今天看到Qu ...
- 盘点 Python 中的那些冷知识(二)
上一篇文章分享了 Python中的那些冷知识,地址在这里 盘点 Python 中的那些冷知识(一) 今天将接着分享!! 06. 默认参数最好不为可变对象 函数的参数分三种 可变参数 默认参数 关键字参 ...
- web 前端冷知识
前端已经被玩儿坏了!像console.log()可以向控制台输出图片等炫酷的玩意已经不是什么新闻了,像用||操作符给变量赋默认值也是人尽皆知的旧闻了,今天看到Quora上一个帖子,瞬间又GET了好多前 ...
- python 冷知识(装13 指南)
python 冷知识(装13 指南) list1 += list2 和 list1 = list1 + list2 的区别 alpha = [1, 2, 3] beta = alpha # alpha ...
- Python 浮点数的冷知识
本周的PyCoder's Weekly 上分享了一篇小文章,它里面提到的冷知识很有意思,我稍作补充,分享给大家. 它提到的部分问题,读者们可以先思考下: 若两个元组相等,即 a==b 且 a is b ...
- 10个不为人知的 Python 冷知识
转载: 1. 省略号也是对象 ...这是省略号,在Python中,一切皆对象.它也不例外. 在 Python 中,它叫做 Ellipsis . 在 Python 3 中你可以直接写…来得到这玩意. 而 ...
随机推荐
- 并发编程之wait()、notify()
前面的并发编程之volatile中我们用程序模拟了一个场景:在main方法中开启两个线程,其中一个线程t1往list里循环添加元素,另一个线程t2监听list中的size,当size等于5时,t2线程 ...
- kubernetes包管理工具Helm安装
helm官方建议使用tls,首先生成证书. openssl genrsa -out ca.key.pem openssl req -key ca.key.pem -new -x509 -days -s ...
- 开源顶级持久层框架——mybatis(ibatis)——day02
mybatis第二天 高级映射 查询缓存 和spring整合 课程复习: mybatis是什么? mybatis是一个持久层框架,mybatis ...
- Bootstrap使用-1
目录 结构: 1. 视图函数 2. 模板 3. 登陆 4. 怎样发生的 添加模板 基础模板提供的block 定制基础模板 结构: $ tree -I "__pycache*|*.pyc|*. ...
- mybatis调用oracle存储过程的几个参考例子
首先写一个存储过程: create or replace procedure p_syn_equipment_20161205 is sqlstr ); begin --清空表 sqlstr := ' ...
- MySQL数据优化
很多企业,可能每天应对的数据量达百万,千万,甚至上亿的访问量,这样的量已经超过普通配置的mysql所承受的量,所以为了应对日益增长的访问量,我们需要对mysql做出相应的对策,进一步优化mysql以达 ...
- activemq之python使用stomp协议
参考链接: 安装:https://pypi.org/project/stomp.py/4.1.8/#history https://www.cnblogs.com/andylhc/p/9337945. ...
- 奇yin技巧
关于一些奇yin技巧 关于删除字符串中的一些字串,并且考虑新的字串 例题:luogu4824 luogu3121 方法:开一个栈记录,发现字串后剪去字串长度. for(int i=1;i<=le ...
- python之可变长参数
参数组:*args,**kwargs 实参有按位置和按关键字两种形式定义,*args和**kwargs 位置参数:按照从左到右的顺序定义的参数 位置形参:必选参数 位置实参:按照位置给形参传值 关键字 ...
- mui slider禁止滑动
网上方法: mui('.mui-slider').slider().setStopped(true); 实际使用 mui('.mui-slider').slider().stopped = true; ...