У меня есть следующее:
<script type = "module">
// some code here to get the <script>'s DOM reference
</script>
Является ли это возможным?
Подобные числовые сценарии могут быть любыми. Я хотел бы вставить HTML после сценария без явной ссылки.
@JaromandaX я бы хотел вставить HTML после сценария без явной ссылки
document.currentScript
не работает для модулей, MDN предлагает «вместо этого использовать import.meta». Но при этом вы можете получить только url
элемента скрипта (который теоретически вы могли бы использовать, чтобы попытаться выбрать элемент, используя селектор атрибутов), но для встроенных скриптов это вернет только URL-адрес самого внедряемого документа.
Думаю, вам понадобится явная ссылка: p
Мне кажется, это правильный вопрос: почему кто-то хочет его закрыть?
Хотя вопрос уже актуален, вы можете улучшить его, приведя несколько примеров случаев использования, которые нелегко решить с помощью другого подхода. (Не уверен, является ли это проблемой XY — вероятно, нет, для этого Y определенно есть допустимое использование, но вы все равно должны указать X)
Возможно, также стоит указать, нужно ли вам это делать только из «основного» модуля или также из его зависимостей, и если да, то что должно произойти, когда одна такая зависимость уже загружена предыдущим модулем. (Примечательно, что даже «основной» модуль уже мог быть загружен зависимостями другого скрипта)
@Kaiido, кажется, нет простого способа справиться с этим. я бы сказал, что во встроенном модуле может быть глобальная функция. он мог бы каким-то образом извлекать переменные из скриптов и сравнивать их с локальными переменными с тем же именем и определять, какой скрипт содержит локальные... в любом случае, я думаю, я нашел другой подход, но сам вопрос и предложения в комментариях интересны
Так может быть, вы могли бы хотя бы сузить свой вопрос до сценариев встроенных модулей? Потому что из внешних я не думаю, что это когда-нибудь будет возможно (если не считать построения собственного графа модулей). Из встроенного вы можете, например, вставить псевдослучайный комментарий в свой скрипт и искать этот комментарий в уценке, чтобы найти правильный элемент.
@Кайидо, да, я знаю, что могу дать ключ. думал, что можно обойтись и без этого
Немного литературы: github.com/whatwg/html/issues/1013
Вы можете использовать классический <script>
, чтобы определить некоторые глобальные переменные, а затем полагаться на тот факт, что <script type = "module">
откладывают по по умолчанию, то есть они будут выполняться по порядку после того, как весь документ будет полностью проанализирован, но до того, как DOMContentLoaded
запустится. .
Этот код предназначен только для того, чтобы дать вам общее представление о том, как вы можете это сделать, не предоставляя явных идентификаторов тегам вашего скрипта через некоторый атрибут data-
, который вы затем можете использовать document.querySelector
.
ПРИМЕЧАНИЕ. Вам нужно просто скопировать/вставить то, что находится в фрагменте, и запустить его на веб-сервере, чтобы увидеть, как он работает, или посмотреть это на страницах GitHub . Я думаю, что среда сниппетов не полностью поддерживает ES-модули.
<!DOCTYPE html>
<html>
<head>
<title></title>
</head>
<body>
<script>
var counted = 1
var script = null
</script>
<p>content before first module script</p>
<script type = "module">
script = document.scripts[counted++]
script.insertAdjacentHTML('afterend', `<p>inserted after ${counted - 1} module script</p>`)
</script>
<p>content after first module script</p>
<script type = "module">
script = document.scripts[counted++]
script.insertAdjacentHTML('afterend', `<p>inserted after ${counted - 1} module script</p>`)
</script>
<p>content after second module script</p>
<script type = "module">
script = document.scripts[counted++]
script.insertAdjacentHTML('afterend', `<p>inserted after ${counted - 1} module script</p>`)
</script>
<p>content after third module script</p>
</body>
</html>
не идеально, но определенно заслуживает награды
Не идеально, если можно так выразиться, но спасибо, что приняли.
Is it possible?
кажется, нет. Это имеет значение?