<!DOCTYPE html>
<html>
<head>
<title>桌面通知Notification </title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script>
</script>
</head>
<body>
<input type="button" value="测试桌面通知" onclick = "checkPermissionAndShow()" />
<script>
window.Notifications = window.Notifications || window.webkitNotifications;
function checkPermissionAndShow(){
var perLel = window.Notifications.checkPermission();
if(perLel == 0){
console.log('已授权...');
showNotification();
}else if(perLel ==1){
console.log('待授权...');
window.Notifications.requestPermission(checkPermissionAndShow);
}else{
console.log('已禁止...');
}
}
function showNotification(){
var newNotification = Notifications.createNotification(
'https://avatar.csdn.net/4/5/3/1_qyf_5445.jpg',
'桌面通知',
'桌面通知 示例');
newNotification.show();
}
</script>
</body>
</html>
