HTML-элементы <script>
предоставляют HTMLScriptElement
интерфейс, который предоставляет специальные свойства и методы для манипулирования поведением и выполнением <script>
элементов (за пределами унаследованного HTMLElement
интерфейса).
JavaScript файлы должны обслуживаться с application/javascript
MIME type, но браузеры снисходительны и блокируют их только, если скрипты обслуживаются с типом изображение (image/*
), типом видео (video/*
), типом аудио (audio/*
), или text/csv
. Если скрипт заблокирован, его элемент получает событие error
; в противном случае, он получает событие success
.
Свойства
Наследует свойства от своего родителя, HTMLElement
.
Имя | Тип | Описание |
---|---|---|
type |
DOMString |
Представляет тип MIME сценария. Он отражает атрибут type . |
src |
DOMString |
Получает и отдает URL внешнего скрипта. Он отражает атрибут src . |
event |
DOMString |
Старый, способ регистрации обработчиков событий на элементы в HTML-документе. |
charset |
DOMString |
Представляет кодировку символов внешнего скрипта. Он отражает атрибут charset . |
async |
Boolean |
Атрибуты Существует три возможных режима выполнения:
Атрибут Примечание: Точные детали обработки для этих атрибутов комплексны, включая множество различных аспектов HTML, и разбросаны по всей спецификации. Эти алгоритмы описывают основную идею, но они основаны на правилах синтаксического анализа для
<script> открывающих и закрывающих тэгах в HTML, во внешнем контенте, и в XML; правиле для метода document.write() ; обработке сценариев; и так далее. |
defer |
Boolean |
|
crossOrigin |
DOMString |
DOMString , отражающий настройку CORS для элементов скрипта. Для скриптов из других источников, он контролирует, будет ли раскрыта информация об ошибке. |
text |
DOMString |
IDL атрибут Примечание: При вставке с использованием метода
document.write() , элементы <script> выполняются (обычно синхронно), когда при вставке используются innerHTML или outerHTML , они вообще не выполняются. |
noModule |
Boolean |
Это булево свойство выполняет остановку выполнения скрипта в браузере, поддерживающим ES2015 модули — используется для запуска резервных скриптов, которые не поддерживают JavaScript модули. |
referrerPolicy |
DOMString |
DOMString , который отражает HTML атрибут referrerpolicy указывающий, какой реферер использовать при извлечении скриптов и выборках, выполненных сценариев. |
Методы
Нет специальных методов; наследует методы от родителей, HTMLElement
.
Примеры
Динамическое импортирование скриптов
Давайте создадим функцию. которая импортирует новый скрипт в документ, создавая ноду <script>
непосредственно перед <script>
, в котором размещается следующий код (через document.currentScript
). Эти скрипты будут выполняться асинхронно. Для получения пдробной информации смотрите свойства defer
и async
.
function loadError(oError) {
throw new URIError("The script " + oError.target.src + " didn't load correctly.");
}
function prefixScript(url, onloadFunction) {
var newScript = document.createElement("script");
newScript.onerror = loadError;
if (onloadFunction) { newScript.onload = onloadFunction; }
document.currentScript.parentNode.insertBefore(newScript, document.currentScript);
newScript.src = url;
}
Следующая функция, вместо добавления новых скриптов непосредственно перед элементом document.currentScript
, добавляет их как потомков тега <head>
.
function loadError(oError) {
throw new URIError("The script " + oError.target.src + " didn't load correctly.");
}
function affixScriptToHead(url, onloadFunction) {
var newScript = document.createElement("script");
newScript.onerror = loadError;
if (onloadFunction) { newScript.onload = onloadFunction; }
document.head.appendChild(newScript);
newScript.src = url;
}
Простое использование:
affixScriptToHead("myScript1.js");
affixScriptToHead("myScript2.js", function () { alert("The script \"myScript2.js\" has been correctly loaded."); });
Спецификации
Спецификация | Статус | Комментарий |
---|---|---|
HTML Living Standard Определение 'HTMLScriptElement' в этой спецификации. |
Живой стандарт | |
HTML 5.1 Определение 'HTMLScriptElement' в этой спецификации. |
Рекомендация | |
HTML5 Определение 'HTMLScriptElement' в этой спецификации. |
Рекомендация | Следующие свойства устарели: htmlFor, . |
Document Object Model (DOM) Level 2 HTML Specification Определение 'HTMLScriptElement' в этой спецификации. |
Устаревшая | Нет изменений в сравнении с Document Object Model (DOM) Level 1 Specification. |
Document Object Model (DOM) Level 1 Specification Определение 'HTMLScriptElement' в этой спецификации. |
Устаревшая | Первое определение. |
Поддержка браузерами
BCD tables only load in the browser
Смотрите также
- HTML-элемент
<script>
- HTML-элемент
<noscript>
document.currentScript
- Web Workers (фрагменты кода, похожие на скрипты, но выполняемые в другом глобальном контексте)
- Ryan Grove's <script> and <link> node event compatibility chart