HTMLScriptElement

DOMの ScriptオブジェクトはHTMLScriptElement (または HTML 4 HTMLScriptElement)インターフェイスに具現化されます．それは通常のelementオブジェクトインターフェイスに加えて(継承によって利用可能)，<script> 要素のレイアウトおよび表現を扱う特別なプロパティとメソッドを提供します．

プロパティ

親である HTMLElementからプロパティを継承しています.

Name Type Description
type DOMString スクリプトのMIME typeを表します．これはtype属性を反映します．
src DOMString

使用される外部スクリプトリソースのアドレスを表します．これは src属性を反映します．
htmlFor これは廃止された API であり、動作は保証されていません。 DOMString [Description missing]
event これは廃止された API であり、動作は保証されていません。 DOMString [Description missing]
charset DOMString 外部スクリプトリソースの文字エンコードを表します．これはcharset属性を反映します．
async Boolean

asyncとdefer属性はboolean属性です．スクリプトがどのように実行されるべきかを示します． defer および async 属性は，src 属性が無ければ指定してはならない．

これら2つの属性値を用いて選択可能な3つのモードがあります．async属性があれば，スクリプトは可能な限り非同期的に実行されます．async属性が無くdefer属性があれば. スクリプトはページのパースが完了した時点で実行されます．両方の属性があれば，スクリプトはユーザーエージェントによるページのパース完了を待つこと無く，フェッチ後，直ちに実行されます．

注記: これらの属性の正確な処理の詳細は，大部分が歴史的な理由により，幾分複雑でHTMLの様々な局面に関連しています．従って，実装の要件は，仕様の至る所に散らばっている必要性によります．These algorithms describe the core of this processing, but these algorithms reference and are referenced by the parsing rules for <script> start and end tags in HTML, in foreign content, and in XML, the rules for the document.write() method, the handling of scripting, etc.

The defer attribute may be specified even if the async attribute is specified, to cause legacy Web browsers that only support defer (and not async) to fall back to the defer behavior instead of the synchronous blocking behavior that is the default.
defer Boolean
crossOrigin これは実験段階の API です。製品内のコードで使用しないようご注意ください。 DOMString Is a DOMString that corresponds to the CORS setting for this script element. See CORS settings attributes for details. It controls, for scripts that are obtained from other origins, whether error information will be exposed.
text DOMString

IDLのtext属性は，すべてのテキストノード(Text nodes)内容の連結を返さなければなりません．(コメントや要素のような他のノードを無視すれば)テキストノードは，木構造(tree)上の順序でscript要素の子要素です．設定上，これはIDLのtextContent属性と同様に機能せねばなりません．

注記:  document.write() メソッドを用いて, <script> 要素を挿入した時，実行されます(典型的には同期的に)．しかし,  innerHTML and outerHTML 属性を用いて挿入した場合,結局何も実行されません．

メソッド

固有のメソッドはありません;親である, HTMLElementから継承しています.

例

例#1: スクリプトを動的にインポートする

新しいスクリプトをドキュメント内にインポート可能にするためimportScript(url[, onloadFunction])と名付けた関数を生成しましょう．インポートはドキュメントの(既存の)<script>の直前に(新たな)<script>ノードを生成して行ないます．既存の<script>は，下記のコード(document.currentScript通じて取得)を提供するものです．これらのスクリプトは非同期的に実行されます．詳細はdeferおよびasyncプロパティを参照．

function loadError (oError) {
  throw new URIError("The script " + oError.target.src + " is not accessible.");
}

function importScript (sSrc, fOnload) {
  var oScript = document.createElement("script");
  oScript.type = "text\/javascript";
  oScript.src = sSrc;
  oScript.onerror = loadError;
  if (fOnload) { oScript.onload = fOnload; }
  document.currentScript.parentNode.insertBefore(oScript, document.currentScript);
}

同じことだがスクリプトをdocument.currentScript要素の直前に加える代わりに，<head> タグの末尾の子として加えています．　

var importScript = (function (oHead) {

  function loadError (oError) {
    throw new URIError("The script " + oError.target.src + " is not accessible.");
  }

  return function (sSrc, fOnload) {
    var oScript = document.createElement("script");
    oScript.type = "text\/javascript";
    oScript.src = sSrc;
    oScript.onerror = loadError;
    if (fOnload) { oScript.onload = fOnload; }
    oHead.appendChild(oScript);
  }

})(document.getElementsByTagName("head")[0]);

使用法:

importScript("myScript1.js");
importScript("myScript2.js", /* onload 関数: */ function () {
alert("You read this alert because the script \"myScript2.js\" has been correctly loaded."); });

仕様

仕様 地位 コメント
HTML Living Standard
HTMLScriptElement の定義		 現行の標準 No change from HTML5.
HTML5
HTMLScriptElement の定義		 勧告 The following properties are now obsolete: htmlFor,.
Document Object Model (DOM) Level 2 HTML Specification
HTMLScriptElement の定義		 廃止 No change from Document Object Model (DOM) Level 1 Specification.
Document Object Model (DOM) Level 1 Specification
HTMLScriptElement の定義		 廃止 Initial definition.

ブラウザ互換性

BCD tables only load in the browser

参考