HTML5桌面通知NotificationAPI用法

if(Notification.permission === 'granted'){
    console.log('用户允许通知');}else if(Notification.permission === 'denied'){
    console.log('用户拒绝通知');}else{
    console.log('用户还没选择，去向用户申请权限吧');} 

Notification.requestPermission().then(function(permission) {
    if(permission === 'granted'){
        console.log('用户允许通知');
    }else if(permission === 'denied'){
        console.log('用户拒绝通知');
    }}); 

var n = new Notification('状态更新提醒',{
    body: '你的朋友圈有3条新状态，快去查看吧',
    tag: 'linxin',
    icon: 'http://blog.gdfengshuo.com/images/avatar.jpg',
    requireInteraction: true}) 

var n = new Notification('状态更新提醒',{
    body: '你的朋友圈有3条新状态，快去查看吧'})setTimeout(function() {
    n.close();}, 3000); 

var n = new Notification('状态更新提醒',{
    body: '你的朋友圈有3条新状态，快去查看吧',
    data: {
        url: 'http://blog.gdfengshuo.com'
    }})n.onclick = function(){
    window.open(n.data.url, '_blank');      // 打开网址
    n.close();                              // 并且关闭通知} 

function addOnBeforeUnload(e) {
    FERD_NavNotice.notification.close();}if(window.attachEvent){
    window.attachEvent('onbeforeunload', addOnBeforeUnload);} else {
    window.addEventListener('beforeunload', addOnBeforeUnload, false);} 

兼容

说到兼容，自然是倒下一大片，而且各浏览器的表现也会有点差异。移动端的几乎全倒，PC端的还好大多都能支持，除了IE。所以使用前，需要先检查一下浏览器是否支持 Notification。

以上就是HTML5 桌面通知 Notification API 用法的详细内容，更多请关注Gxl网其它相关文章！

查看更多关于HTML5桌面通知NotificationAPI用法的详细内容...