调用Node.appendChild（）添加脚本标签时会发生什么？

Question

我正在尝试从外部页面中的脚本标签加载函数，但是我想将它们绑定到新的上下文。 （this指向摘要中的宿主元素）

this.attachShadow({mode: 'open'}).appendChild(template)
const scriptNode = document.createElement('script')
scriptNode.innerHTML = script.textContent
scriptNode.async = false
this.shadowRoot.appendChild(scriptNode)
render.call(this)

这是我想要的方式，但是首先我污染了全局环境，并且我不确定将脚本标签添加到主机时会发生什么。

我可以安全地假设脚本将始终在调用下一行（render.call）之前首先执行吗？

此外，我们还有更好的方法从其他文件加载某些脚本吗？

Answer 1

不要将其作为最佳实践，因为我不知道是否有更好的解决方案（当然，新的javascript模块也会有），但是您可以尝试以下方法：

scriptNode.innerHTML = '(function () { ' + script.textContent + ' }).apply(/*this*/ window)';