## Notification Notifications API 的通知接口用于向用戶配置和顯示桌面通知。 語法： ``` let notification = new Notification(title, options) ``` 參數： * title：一定會被顯示的通知標題 * options 可選，一個被允許用來設置通知的對象。它包含以下屬性： - dir : 文字的方向；它的值可以是 auto（自動）, ltr（從左到右）, or rtl（從右到左） - lang: 指定通知中所使用的語言。這個字符串必須在 BCP 47 language tag 文檔中是有效的。 - body: 通知中額外顯示的字符串 - tag: 賦予通知一個ID，以便在必要的時候對通知進行刷新、替換或移除。 - icon: 一個圖片的URL，將被用于顯示通知的圖標。 ### 屬性 **靜態屬性** `Notification.permission ` 只讀，一個用于表明當前通知顯示授權狀態的字符串。可能的值包括：denied (用戶拒絕了通知的顯示), granted (用戶允許了通知的顯示), 或 default (因為不知道用戶的選擇，所以瀏覽器的行為與 denied 時相同). **實例屬性** | 屬性 | 描述 | | :--: | :--: | | Notification.title | 在構造方法中指定的 title 參數 | | Notification.dir | 通知的文本顯示方向 | | Notification.lang | 通知的語言 | | Notification.body | 通知的文本內容 | | Notification.tag | 通知的 ID | | Notification.icon | 通知的圖標圖片的 URL 地址 | **事件** | 事件 | 描述 | | :--: | :--: | | Notification.onclick | 處理 click 事件的處理 | | Notification.onshow | 處理 show 事件的處理 | | Notification.onerror | 處理 error 事件的處理 | | Notification.onclose | 處理 close 事件的處理 | ### 方法 **靜態方法** `Notification.requestPermission()` 用于當前頁面想用戶申請顯示通知的權限。這個方法只能被用戶行為調用（比如：onclick 事件），并且不能被其他的方式調用。 **實例方法** | 方法 | 描述 | | :--: | :--: | | Notification.close() | 用于關閉通知 | **簡單實例** ``` // 申請權限 function requestNotification(title, options) { // 先檢查瀏覽器是否支持 if (!('Notification' in window)) { alert('This browser does not support desktop notification'); } // 檢查用戶是否同意接受通知 else if (Notification['permission'] === 'granted') { this.openNotification(title, options); } // 否則我們需要向用戶獲取權限 else if (Notification['permission'] !== 'denied') { Notification.requestPermission((permission) => { if (permission === 'granted') { // 如果用戶同意，就可以向他們發送通知 openNotification(title, options); } }); } } function openNotification(title, options) { const notification = new Notification(title, options); notification.onclose = (event) => { // 當關閉時 } } requestNotification('您有一條消息通知', { body: '來自XX', requireInteraction: true, data: {}, icon: 'notification-icon.jpg' }); ```