Что происходит, когда вызывается 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)';