Microsoft Edge 扩展，如何操作 popup.html DOM答案

【问题标题】：Microsoft Edge Extension, how to manipulate popup.html DOMMicrosoft Edge 扩展，如何操作 popup.html DOM
【发布时间】：2023-03-17 18:42:01
【问题描述】：

我是浏览器扩展开发的新手。我正在尝试做一些简单的事情，但我真的不知道为什么不起作用。问题是什么？我无法操作我的 popup.html 文件的 DOM。这里举个例子：

<html>
<head>
 <script src="js/jquery.js"></script>
 <script src="js/main.js"></script>
</head>
<body id="content">
 <p> Hello world </p>
 <button id="go" />
</body>
</html>

这里是我非常简单的 main.js 文件：

$(document).ready(function() { 

 $('#go').click( function(){

    $( "#content" ).empty();
    alert("Done");
 });
});

点击后，我的 Body 的内容似乎并没有消失，但是如果我发出警报，我可以看到我的代码工作（当警报显示时）。但是在 click() 事件之后（当我关闭警报时），它的弹出文件被恢复并且段落仍然在这里。

那么，我做错了什么？我可以操作弹出文件的 DOM 吗？还是我的 JS 代码需要修复？我进行了一些测试，我注意到任何事件、任何数据和任何操作都在 click() 事件之后消失。我也试过了

location.href = "other_page.html";

重定向工作，但正如我在点击后所说的，我在 popup.html 文件中返回。

谢谢，我来这里是为了更规范

【问题讨论】：

您的代码对我来说运行良好。能否请您提供更多详细信息，例如manifest.json 和Edge 版本？
这是我的清单：pastebin.com/rXGWMKZe
"browser_style": true 在 Microsoft Edge 中不支持，您确定可以成功加载扩展吗？

标签： javascript jquery dom microsoft-edge-extension

【解决方案1】：

我遇到了同样的问题.... 我认为 Edge 不喜欢 jquery click() 函数。

试试这个：

document.getElementById("logout").addEventListener("click", function() { 
$( "#content" ).empty();
alert("Done");
}

我已经这样解决了:)

【讨论】：