使用场景 适用于提示用户有新的未读消息，一系列推送广告/系统更新消息等......
知道了使用场景后， 接着先上一段完整代码
1 //注册权限 2 Notification.requestPermission(function (status) { 3 ????// 这将使我们能在 Chrome/Safari 中使用 Notification.permission 4 ????if (Notification.permission !== status) { 5 ??????Notification.permission = status; 6 ????} 7 }); 8 //消息推送 9 var n = new Notification(‘博客更新提示‘,{10 ????body: ‘您的博客园有新文章发布,欢迎关注哦‘,11 ????tag: ‘avenstar‘, //代表通知的一个识别标签，相同tag时只会打开同一个通知窗口12 ????icon: ‘https://pic.cnblogs.com/avatar/819169/20171029125922.png‘,13 ????requireInteraction: true //通知保持有效不自动关闭，默认为false14 })打开Chrome浏览器，F12运行效果如下 (针对上述代码，下面逐一展开说明)
请求权限 requestPermission
Notification.requestPermission(function (status) { ???// 这将使我们能在 Chrome/Safari 中使用 Notification.permission ???if (Notification.permission !== status) { ?????Notification.permission = status; ???} ?});检查当前权限状态（查看你是否已经有权限） Notification.permission 该属性的值将会是下列三个之一：
default 用户还未被询问是否授权，所以通知不会被显示。granted 表示之前已经询问过用户，并且用户已经授予了显示通知的权限。denied 用户已经明确的拒绝了显示通知的权限。
消息通知 Notification
var n = new Notification(‘博客更新提示‘,{ ???body: ‘您的博客园有新文章发布,欢迎关注哦‘, ???tag: ‘avenstar‘, //代表通知的一个识别标签，相同tag时只会打开同一个通知窗口 ???icon: ‘https://pic.cnblogs.com/avatar/819169/20171029125922.png‘, ???requireInteraction: true //通知保持有效不自动关闭，默认为false})资料参考
http://www.zhangxinxu.com/wordpress/2016/07/know-html5-web-notification/
https://developer.mozilla.org/zh-CN/docs/Web/API/notification/Using_Web_Notifications
桌面消息通知：HTML5 Notification
原文地址：http://www.cnblogs.com/zjf-1992/p/7795786.html