我正在使用Safari应用程序扩展将我的WebExtension移植到Safari。
我的扩展是在DOM中的iframe注入，所以我想将类似于此注入脚本的内容加载为SFSafariContentScript。
document.addEventListener('DOMContentLoaded', function(e) {
var newElement = document.createElement("script");
newElement.src = safari.extension.baseURI + "bundle.js";
document.body.insertBefore(newElement, document.body.firstChild);
});
问题是，当我的iframe被注入时，DOMContentLoaded事件似乎再次被触发，这导致了一个无限循环。
这种行为似乎不同于您对具有两个文件index.html和index.js的简单注入脚本的预期。
───────┬───────────────────────────────────────────────────────────────────
│ File: index.html
───────┼───────────────────────────────────────────────────────────────────
1 │ <html>
2 │ <head>...</head>
3 │ <body><div>...</div></body>
4 │ <script src="index.js"></script>
5 │ </html>
───────┴───────────────────────────────────────────────────────────────────
───────┬───────────────────────────────────────────────────────────────────
│ File: index.js
───────┼───────────────────────────────────────────────────────────────────
1 │ document.addEventListener('DOMContentLoaded', function(e) {
2 │ var newElement = document.createElement('script');
3 │ newElement.src = './bundle.js';
4 │ document.body.insertBefore(newElement, document.body.firstChild);
5 │ });
───────┴───────────────────────────────────────────────────────────────────
如果我在Safari应用程序扩展中用几秒钟的setTimeout替换addEventListener，则我的扩展已正确注入并运行良好，但选择任意时间注入iframe对我来说感觉很糟糕。
如何使用Safari应用程序扩展将iframe正确地注入DOM？
在这个条件之间封装我的代码就像苹果文档中的注入脚本部分一样。
if (window.top === window) {
// The parent frame is the top-level frame, not an iframe.
// All non-iframe code goes before the closing brace.
document.addEventListener('DOMContentLoaded', function(e) {
var newElement = document.createElement("script");
newElement.src = safari.extension.baseURI + "bundle.js";
document.body.insertBefore(newElement, document.body.firstChild);
});
}