HTML5 Web Notification桌面通知
兼容性：IE14以及其他桌面浏览器都支持Web Notification；Android部分支持，iOS Safari浏览器全军覆没(至9.3版本)：
<button id="button">有人想加你为好友</button>
<p id="text"></p>
JS代码：
if (window.Notification) {
var button = document.getElementById('button'), text = document.getElementById('text');
var popNotice = function() {
if (Notification.permission == "granted") {
var notification = new Notification("Hi，帅哥：", {
body: '可以加你为好友吗？',
icon: 'http://image.zhangxinxu.com/image/study/s/s128/mm1.jpg'
});
notification.onclick = function() {
text.innerHTML = '张小姐已于' + new Date().toTimeString().split(' ')[0] + '加你为好友！';
notification.close();
};
}
};
button.onclick = function() {
if (Notification.permission == "granted") {
popNotice();
} else if (Notification.permission != "denied") {
Notification.requestPermission(function (permission) {
popNotice();
});
}
};
} else {
alert('浏览器不支持Notification');
}
知识点：
Notification.requestPermission()
静态方法，作用就是让浏览器出现是否允许通知的提示，window系统Chrome浏览器目前的UI效果是这样的：
Notification.requestPermission().then(function(result) {
// result可能是是granted, denied, 或default. === Notification.permission
});
Notification.permission（只读属性）
granted, denied, 或default.
- new Notification(title, options) 显示通知。title必选：通知的标题内容；options可选，参数见下表：
属性名 释义
dir 默认auto, 可以是ltr或rtl，提示主体内容的水平书写顺序。
lang 提示的语言。
body 提示主体内容。字符串。会在标题的下面显示。
tag 字符串。标记当前通知的标签。
icon 字符串。通知面板左侧那个图标地址。
data 任意类型和通知相关联的数据。
vibrate 通知显示时振动模式。[200, 100, 200] 表示设备振动200毫秒后停止100毫秒再振动200毫秒。
renotify 布尔值。是否替换旧通知。true表示当前标记的通知只会出现一个（tag需要设值）。默认false叠高楼
silent 布尔值。通知出现的时候，是否要有声音。默认false, 表示无声。
sound 字符串。音频地址。表示通知出现要播放的声音资源。
noscreen 布尔值。是否不再屏幕上显示通知信息。默认false, 表示要在屏幕上显示通知内容。
sticky 布尔值。是否通知具有粘性，这样用户不太容易清除通知。默认false, 表示没有粘性。根据我自己的猜测，应该和position的sticky属性值类似。
Notification.close()Notification.onclick 事件句柄
Notification.onerror 通知显示异常，
Notification.onclose 通知关闭都会触发该该事件
Notification.onshow 通知显示触发
其他属性值除了Notification.permission外，Notification还有很多其他只读属性值，但是，基本上和上面的options参数一致，返回的值也是options和默认值的合并值（如果浏览器支持的话）。
Notification.title[只读]
Notification.dir[只读]
Notification.lang[只读]
Notification.body[只读]
Notification.tag[只读]
Notification.icon[只读]
Notification.data[只读]
Notification.silent[只读]
Notification.title[只读]
Notification.timestamp[只读]通知创建或者可以使用的时间。
Notification.noscreen[只读]
Notification.renotify[只读]
Notification.sound[只读]
Notification.sticky[只读]
Notification.vibrate[只读]
