浏览器通知Web Notifications实例页面

Post Time:2020-01-29 18:26:00 Views:434

效果图

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
        <title></title>
    </head>

    <body>
        <button id="button">点击显示通知内容</button>
<p id="text"></p>
<script type="text/javascript" charset="utf-8">
    if (window.Notification) {
    var button = document.getElementById('button'), text = document.getElementById('text');

    var popNotice = function() {
        if (Notification.permission == "granted") {
            var notification = new Notification("您有一条新的消息通知:", {
                body: '{"status":"ok","code":200,"data":{"msg":"面朝大海,春暖花开","description":"正在开发中..."},"msg":"success","timestamp":1580293406,"date":"2020-01-29 18:23:26"}',
                icon: '//199508.com/static/images/NobitaFace.jpg'
            });

            notification.onclick = function() {
                text.innerHTML = '{"status":"ok","code":200,"data":{"msg":"面朝大海,春暖花开","description":"正在开发中..."},"msg":"success","timestamp":1580293406,"date":"2020-01-29 18:23:26"}';
                notification.close();    
            };
        }    
    };

    button.onclick = function() {
        if (Notification.permission == "granted") {
            popNotice();
        } else if (Notification.permission != "denied") {
            Notification.requestPermission(function (permission) {
              popNotice();
            });
        }
    };
} else {
    alert('浏览器不支持Notification');    
}
</script>
    </body>
</html>

Comments: 11
Time: 2020-02-06 20:13:02
熊大好啊,找不到留言板,nichijou改域名了,新域名就是这条留言地址。
Time: 2020-03-04 17:24:17
@Ng ok啊,很牛逼的域名!!
Time: 2020-02-09 10:03:55
来你博客 都是直接输入域名的 特好记
Time: 2020-02-19 10:30:16
@夏目贵志 我博客也好记~哈哈哈哈哈哈哈哈哈
Time: 2020-02-25 15:33:19
@狗 妈的,你回来看看你输入的是什么几把东西....
Time: 2020-02-26 20:50:14
@狗 可以 可以 我的被注册了,无奈 几年前就被注册了!
Time: 2020-03-06 21:06:52
@狗 我也注册了一个 199607.yxz
Time: 2020-03-08 12:36:22
@夏目贵志 牛皮啊,小伙子.
Time: 2020-03-08 12:39:34
@夏目贵志 不过你好像打错了,是xyz.
Time: 2020-03-08 20:47:44
@大雄 打错了,w(゚Д゚)w com被注册了!不然想注册com的!
Time: 2020-02-12 16:25:54
牛皮呀,可以抛弃js扩展了,哈哈哈

「人生在世,留句话给我吧」

撰写评论