W3Cschool
恭喜您成為首批注冊(cè)用戶
獲得88經(jīng)驗(yàn)值獎(jiǎng)勵(lì)
Notification API是瀏覽器的通知接口,用于在用戶的桌面(而不是網(wǎng)頁(yè)上)顯示通知信息,桌面電腦和手機(jī)都適用,比如通知用戶收到了一封Email。具體的實(shí)現(xiàn)形式由瀏覽器自行部署,對(duì)于手機(jī)來(lái)說,一般顯示在頂部的通知欄。
如果網(wǎng)頁(yè)代碼調(diào)用這個(gè)API,瀏覽器會(huì)詢問用戶是否接受。只有在用戶同意的情況下,通知信息才會(huì)顯示。
下面的代碼用于檢查瀏覽器是否支持這個(gè)API。
if (window.Notification) {
// 支持
} else {
// 不支持
}
目前,Chrome和Firefox在桌面端部署了這個(gè)API,F(xiàn)irefox和Blackberry在手機(jī)端部署了這個(gè)API。
if(window.Notification && Notification.permission !== "denied") {
Notification.requestPermission(function(status) {
var n = new Notification('通知標(biāo)題', { body: '這里是通知內(nèi)容!' });
});
}
上面代碼檢查當(dāng)前瀏覽器是否支持Notification對(duì)象,并且當(dāng)前用戶準(zhǔn)許使用該對(duì)象,然后調(diào)用Notification.requestPermission方法,向用戶彈出一條通知。
Notification.permission屬性,用于讀取用戶給予的權(quán)限,它是一個(gè)只讀屬性,它有三種狀態(tài)。
Notification.requestPermission方法用于讓用戶做出選擇,到底是否接收通知。它的參數(shù)是一個(gè)回調(diào)函數(shù),該函數(shù)可以接收用戶授權(quán)狀態(tài)作為參數(shù)。
Notification.requestPermission(function (status) {
if (status === "granted") {
var n = new Notification("Hi!");
} else {
alert("Hi!");
}
});
上面代碼表示,如果用戶拒絕接收通知,可以用alert方法代替。
Notification對(duì)象作為構(gòu)造函數(shù)使用時(shí),用來(lái)生成一條通知。
var notification = new Notification(title, options);
Notification構(gòu)造函數(shù)的title屬性是必須的,用來(lái)指定通知的標(biāo)題,格式為字符串。options屬性是可選的,格式為一個(gè)對(duì)象,用來(lái)設(shè)定各種設(shè)置。該對(duì)象的屬性如下:
上面這些屬性,都是可讀寫的。
下面是一個(gè)生成Notification實(shí)例對(duì)象的例子。
var notification = new Notification('收到新郵件', {
body: '您總共有3封未讀郵件。'
});
notification.title // "收到新郵件"
notification.body // "您總共有3封未讀郵件。"
Notification實(shí)例會(huì)觸發(fā)以下事件。
這些事件有對(duì)應(yīng)的onshow、onclick、onclose、onerror方法,用來(lái)指定相應(yīng)的回調(diào)函數(shù)。addEventListener方法也可以用來(lái)為這些事件指定回調(diào)函數(shù)。
notification.onshow = function() {
console.log('Notification shown');
};
Notification實(shí)例的close方法用于關(guān)閉通知。
var n = new Notification("Hi!");
// 手動(dòng)關(guān)閉
n.close();
// 自動(dòng)關(guān)閉
n.onshow = function () {
setTimeout(n.close.bind(n), 5000);
}
上面代碼說明,并不能從通知的close事件,判斷它是否為用戶手動(dòng)關(guān)閉。
Copyright©2021 w3cschool編程獅|閩ICP備15016281號(hào)-3|閩公網(wǎng)安備35020302033924號(hào)
違法和不良信息舉報(bào)電話:173-0602-2364|舉報(bào)郵箱:jubao@eeedong.com
掃描二維碼
下載編程獅App
編程獅公眾號(hào)
聯(lián)系方式:
更多建議: