Network Security Internet Technology Development Database Servers Mobile Phone Android Software Apple Software Computer Software News IT Information

In addition to Weibo, there is also WeChat

Please pay attention

WeChat public account

Shulou

How to realize the Desktop Notification prompt function by HTML5

2025-04-05 Update From: SLTechnology News&Howtos shulou NAV: SLTechnology News&Howtos > Internet Technology >

Share

Shulou(Shulou.com)05/31 Report--

This article mainly explains "HTML5 how to achieve desktop notification prompt function", interested friends may wish to take a look. The method introduced in this paper is simple, fast and practical. Next let the editor to take you to learn "HTML5 how to achieve desktop notification prompt function" bar!

The specific code is as follows:

Someone wants to add you as a friend.

; (function () {if (window.Notification) {var btn = document.getElementById ("button"); var txt = document.getElementById ("text"); btn.onclick = function () {if (Notification.permission = = "granted") {popNotice () } else if (Notification.permission! = "denied") {Notification.requestPermission () .then (function (permission) {popNotice ()})}} Function popNotice () {if (Notification.permission = = "granted") {var notification = new Notification ("Hello:", {body: "are you free tonight", icon: "http://image.zhangxinxu.com/ left avatar address"}) Notification.onclick = function () {txt [XSS _ clean] = new Date (). ToTimeString (). Split ("") [0] + "received message"; notification.close ();}} else {console.log ("browser does not support Notification");}}) ()

Notification.requestPermission () is a request that prompts browsers whether to allow notification or not. Like Notification.permission, users return "3" values of "granted", "default" and "denied". Users do not care about notification yet, and users dislike it.

At this point, I believe you have a deeper understanding of "HTML5 how to achieve desktop notification prompt function", might as well come to the actual operation of it! Here is the website, more related content can enter the relevant channels to inquire, follow us, continue to learn!

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.

Views: 212

*The comments in the above article only represent the author's personal views and do not represent the views and positions of this website. If you have more insights, please feel free to contribute and share.

Share To

Internet Technology

Wechat

© 2024 shulou.com SLNews company. All rights reserved.

12
Report