修改htmlElement的原型，返回當前對象的pr

修改htmlElement的原型，返回當前對象的proxy

改 HTMLElement 的原型來增加一個函數，該函數返回當前對象的 Proxy，并為每個屬性添加 get 和 set 攔截器。以下是一個示例程序：

// 修改 HTMLElement 的原型，增加一個返回 Proxy 的方法
HTMLElement.prototype.getProxy=function() {
const handler={
get: (target, prop, receiver)=> {
console.log(`Getting property ${prop}`);
return Reflect.get(target, prop);
},
set: (target, prop, value, receiver)=> {
console.log(`Setting property ${prop} to ${value}`);
return Reflect.set(target, prop, value);
}
};
return new Proxy(this, handler);
};
document.addEventListener("DOMContentLoaded",()=>{
// 示例 HTML 元素
const div=document.createElement('div');
div.id='myDiv';
div.textContent='Hello, World!';
document.body.appendChild(div);
// 獲取元素的 Proxy
const proxyDiv=div.getProxy();
// 訪問和修改屬性以觸發攔截器
console.log(proxyDiv.id); // Getting property id
proxyDiv.textContent='Hello, Proxy!'; // Setting property textContent to Hello, Proxy!
})

如果屬性的get、set方法由外部傳入，可以定義一個map，存儲攔截器信息。具體升級步驟如下：

創建代理對象：在 createProxy 方法中，我們使用 Proxy 創建一個代理對象，并在 get 和 set 攔截器中檢查是否存在自定義的攔截函數。
添加攔截器：addInterceptor 函數用于向元素的 __proxyMap 中添加自定義的 getter 和 setter 函數。
示例代碼：在 DOMContentLoaded 事件中，我們創建一個 div 元素，并為其 id 和 textContent 屬性添加自定義的 getter 和 setter 函數。然后，通過調用 createProxy 方法獲取代理對象，并訪問和修改屬性以觸發攔截器。

內容首發于工粽號：程序員大澈，每日分享一段優質代碼片段，歡迎關注和投稿！

大家好，我是大澈！

本文約 700+ 字，整篇閱讀約需 1 分鐘。

今天分享一段優質 JS 代碼片段，實現在關閉或刷新瀏覽器窗口時做提示。

老規矩，先閱讀代碼片段并思考，再看代碼解析再思考，最后評論區留下你的見解！

window.addEventListener('beforeunload', function (event) {
    const confirmationMessage="確定要離開此頁面嗎？您所做的更改可能不會被保存。";
 
    event.preventDefault();
    event.returnValue=confirmationMessage; 

    return confirmationMessage;
});

分享原因

這段代碼展示了如何使用 JavaScript 的 beforeunload 事件來提示用戶在關閉或刷新瀏覽器窗口時確認操作，從而避免意外的數據丟失或操作中斷。

這種方法適用于未保存的數據（如填寫表單或編輯文檔）、長時間操作（如文件上傳或大規模數據處理）、敏感操作（如在線交易或重要系統設置）等場景。

項目中用到時直接CV，但對于用戶體驗而言，不宜過度使用。

代碼解析

1. window.addEventListener('beforeunload', function (event) { ... })

為 window 對象添加一個 beforeunload 事件監聽器。

當用戶試圖關閉或刷新瀏覽器窗口時，此事件將被觸發。

2. event.preventDefault();

調用 event.preventDefault() 方法來阻止默認的瀏覽器行為。

在大多數情況下，這一步是冗余的，因為 beforeunload 事件默認不會執行任何動作，但這可以確保兼容性。

3. event.returnValue=confirmationMessage;

設置 event.returnValue 為 confirmationMessage 提示信息。

這是確保在大多數現代瀏覽器中顯示確認對話框的關鍵步驟。

4. return confirmationMessage;

返回 confirmationMessage 提示信息。

在一些舊版瀏覽器中，這一步是必要的，以確保顯示提示信息。

軟計劃在2020年1月15日正式發布新的Microsoft Edge瀏覽器，并決定通過Windows Update推出它，而不是手動下載它。

安裝新的瀏覽器后，它將替換設備上現有的Microsoft Edge瀏覽器，這對許多人來說是一件好事，因為它將提供與網站的更大兼容性，并提高性能。

但是，對于使用為Microsoft Edge的EdgeHTML呈現引擎構建的網站的組織而言，這種強制安裝可能是他們不想要的。

為了容納這些企業用戶，Microsoft發布了支持文檔和稱為Microsoft Edge Blocker Toolkit的工具，該工具可用于創建注冊表值，該注冊表值阻止新Microsoft Edge的自動交付。

“為幫助我們的客戶變得更加安全和最新，Microsoft將通過Windows 10 RS4及更高版本的自動更新來分發Microsoft Edge（基于Chromium）。Blocker Toolkit適用于希望阻止自動交付Windows 10 RS4的組織。 Microsoft Edge（基于Chromium）連接到啟用了自動更新的環境中的計算機?！白柚钩绦蚬ぞ甙辈粫^期。”

Microsoft聲明此注冊表值僅在Windows 10 RS4（版本1803）或更高版本上可用，并且僅阻止使用Windows Update安裝Microsoft Edge。

對于運行Windows 10 RS4和更高版本的計算機，“阻止程序工具包”阻止計算機通過自動更新接收Microsoft Edge（基于Chromium）。
Blocker Toolkit不會阻止用戶通過Internet下載或外部媒體手動安裝Microsoft Edge（基于Chromium）。
組織無需在使用更新管理解決方案（例如Windows Server Update Services或System Center Configuration Manager）管理的環境中部署Blocker Toolkit。組織可以使用這些產品在其環境中全面管理通過Windows Update和Microsoft Update（包括Microsoft Edge（基于Chromium））發布的更新的部署。

阻止程序工具包包括HTML指令，CMD腳本和組策略模板，這些模板可用于控制新Microsoft Edge瀏覽器的自動交付，我們將在下一部分中進行討論。

Windows Update阻止安裝

Microsoft已在Windows 10中添加了新的注冊表值，該值阻止自動安裝新的Microsoft Edge。

需要在HKEY_LOCAL_MACHINE \ SOFTWARE \ Microsoft \ EdgeUpdate項下創建此新值，并將其稱為DoNotUpdateToEdgeWithChromium。

如果將此值設置為1，Edge將通過Windows Update阻止，如果將其設置為0或丟失，Edge將被自動安裝。

下面，我們提供了三種方法，用戶可用來在Windows設備上創建此注冊表值。

方法1：直接修改注冊表

對于習慣于修改Windows注冊表的用戶，最簡單的方法是手動創建或通過如下所示的注冊表文件創建DoNotUpdateToEdgeWithChromium注冊表值鍵。

Windows注冊表編輯器版本5.00

[HKEY_LOCAL_MACHINE \ SOFTWARE \ Microsoft \ EdgeUpdate]
“ DoNotUpdateToEdgeWithChromium”=dword：00000001

要使用注冊表文件進行更改，只需按照以下步驟操作：

打開記事本，然后將上述注冊表文件的內容復制并粘貼到記事本中。
將文件另存為Windows桌面上的BlockAutoEdge.reg。
雙擊文件，然后讓Windows合并數據。

這將導致自動創建DoNotUpdateToEdgeWithChromium注冊表值并將其設置為1，如下所示。

DoNotUpdateToEdgeWithChromium注冊表值已創建

如果您不滿意創建上述注冊表文件，則可以從此處下載它。

方法2：使用Microsoft Edge阻止程序工具包

Microsoft已發布Microsoft Edge Blocker Toolkit，該工具包可在本地或遠程計算機上自動創建注冊表值。

要使用該工具，只需下載程序并執行以將附帶的文件提取到文件夾中即可。提取的文件將由組策略模板，HTML指令和名為EdgeChromium_Blocker.cmd的CMD腳本組成。

要使用EdgeChromium_Blocker.cmd，請打開提升權限的命令提示符，將cd插入您解壓縮文件的目錄中，然后執行EdgeChromium_Blocker.cmd腳本以查看下面顯示的幫助屏幕。

MICROSOFT TOOL KIT TO DISABLE DELIVERY OF
MICROSOFT EDGE (CHROMIUM-BASED)

Copyright (C) Microsoft Corporation.  All rights reserved.


This tool can be used to remotely block or unblock the delivery of
Microsoft Edge (Chromium-based) via Automatic Updates.

------------------------------------------------------------
Usage:
EdgeChromium_Blocker.cmd [machine name] [/B] [/U] [/H]
B=Block Microsoft Edge (Chromium-based) deployment
U=Allow Microsoft Edge (Chromium-based) deployment
H=Help

To block or unblock installation on the local machine use
period ("." with no quotes) as the machine name

Examples:
EdgeChromium_Blocker.cmd mymachine /B (blocks delivery on machine "mymachine")

EdgeChromium_Blocker.cmd /U (unblocks delivery on the local machine)
------------------------------------------------------------

要阻止Microsoft Edge的自動安裝，您將執行“ EdgeChromium_Blocker.cmd / B ”命令。

要取消阻止Microsoft Edge的安裝，請執行“ EdgeChromium_Blocker.cmd / U ”命令。

方法3：使用Edge組策略模板

可以用來阻止自動安裝基于Chromium的Microsoft Edge的最終方法是下載并安裝Microsoft Edge Blocker Toolkit。

解壓縮文件后，將EdgeChromium_Blocker.adml文件復制到C：\ Windows \ PolicyDefinitions文件夾，將EdgeChromium_Blocker.admx文件復制到C：\ Windows \ PolicyDefinitions \ en-us文件夾。

現在，您可以打開組策略編輯器，并且以下文件夾下提供了一個名為“不允許通過自動更新傳遞Microsoft（基于Chromium的）Microsoft”的新策略：

/Computer Configuration  
  /Administrative Templates
    /Windows Components
      /Windows Update  
        /Microsoft Edge (Chromium-based) Blockers

可以在下面的策略編輯器中看到此新策略。

新的Microsoft Edge政策

啟用后，組策略編輯器將自動將DoNotUpdateToEdgeWithChromium值添加到注冊表中。

在線咨詢

上一篇：一起學爬蟲-使用Beautiful Soup爬取網頁
下一篇：64-文字漸變效果

您的項目需求

*請認真填寫需求信息，我們會在24小時內與您取得聯系。