HTML5 데스크탑 알림 프롬프트 기능 구현

HTML5는 웹페이지에 더 나은 의미와 구조를 제공합니다. 더욱 풍부한 태그는 RDFa, 마이크로데이터 및 마이크로포맷에 대한 지원과 함께 제공되어 프로그램과 사용자 모두에게 더욱 가치 있는 데이터 기반 웹을 구축합니다. 이 기사에서는 HTML5에서 데스크톱 알림 프롬프트 기능을 구현하는 방법을 공유합니다.

구체적인 코드는 다음과 같습니다.

<button id="button">有人想加你为好友</button>
<p id="text"></p>
;(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("你好:",{
                    body:"请问今晚有空吗",
                    icon:"http://image.zhangxinxu.com/左边头像地址"
                });
                notification.onclick = function (){
                    txt.innerHTML = new Date().toTimeString().split(" ")[0]+"收到信息";
                    notification.close();
                }
            }
        }
    }else{
        console.log("浏览器不支持Notification");
    }
})();

Notification.requestPermission()은 브라우저가 알림 허용 여부를 묻는 메시지를 표시할 수 있는 요청입니다. "3" 값 ​​"granted""를 반환합니다. default"는Notification.permission과 같습니다." "denied" 사용자가 알림을 허용하고 아직 관리하지 않았으며 사용자가 싫어합니다.

관련 권장 사항:

HTML5 데스크톱 알림 알림 API 사용

html5 데스크톱 알림(웹 알림) 예제 Analysis_html5 튜토리얼 기술

H5 데스크톱 알림 및 프롬프트 기능 구현의 예

위 내용은 HTML5 데스크탑 알림 프롬프트 기능 구현의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!