当前位置：文江博客知识库简体中文文档 Web API HTMLScriptElement

HTMLScriptElement - Web API 接口参考编辑

HTML脚本元素暴露HTMLScriptElement接口,它提供了特殊的属性和方法(超出了常规HTMLElement对象接口,他们也可以通过继承操纵<脚本>元素的布局和演示。）

Properties

从其父类中继承的属性, HTMLElement。

Name	Type	Description
`type`	`DOMString`	代表了脚本的MIME类型。它反映了`type` 属性。如何解析奇异的编程语言,请阅读这篇文章。
`src`	`DOMString`	代表了使用外部脚本资源的地址。它反映了`src`属性。
`htmlFor`	`DOMString`	他htmlFor属性设置或返回的值的属性标签。属性指定的表单元素绑定到一个标签。
`event`	`DOMString`	HTML DOM事件允许JavaScript注册不同的事件处理程序的元素在一个HTML文档。
`charset`	`DOMString`	代表外部脚本资源的字符编码。它反映了`charset` 属性。
`async`	`Boolean`	async和defer属性值为bool，它用来说明script脚本应该如何执行。在没有src属性的情况下，async和defer属性可以不指定值。使用该属性有三种模式可供选择，如果async属性存在，脚本将异步执行，只要它是可用的，如果async属性不存在，而defer属性存在，脚本将会在页面完成解析后执行，如果都不存在，那么脚本会在useragent解析页面之前被取出并立刻执行。注意:这些属性的处理细节,主要是历史原因,有些重要的,涉及很多方面的HTML。因此实现需求的必要性分散在规范。这些描述这个处理的核心算法,但这些算法参考和引用的解析规则{ HTMLElement("脚本")} { }开始和结束标记在HTML中,在国外内容,并在XML中,规则的document . write()方法,处理脚本等。延迟属性可以指定即使指定异步属性,导致遗留Web浏览器只支持推迟(而不是异步)回落推迟行为而不是同步阻塞是默认的行为。
`defer`	`Boolean`
`crossOrigin`	`DOMString`	是一个`DOMString`,对应于歌珥设置这个脚本元素。有关详细信息,请参阅歌珥设置属性。这对脚本控制,从其他来源,获得错误信息是否会被暴露出来。
`text`	`DOMString`	IDL属性内容的文本必须返回一个连接的所有文本节点的孩子`<script>`元素(忽略任何其他节点如评论或元素),在树的顺序。设置,它必须采取行动一样textContent IDL属性。注意:当插入使用document . write()方法,{ { HTMLElement("脚本")} }元素执行(通常是同步),但当插入使用innerHTML和outerHTML属性,他们不执行。

例子

动态导入脚本

让我们创建一个名为importScript的函数，它能够在一个文档中导入新的脚本，创建一个<script> 节点，并立即插入到宿主<script> 之前 (通过 document.currentScript 可以获取宿主script标签）。这些脚本将异步执行。更多细节,请参见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.onerror = loadError;
  if (fOnload) { oScript.onload = fOnload; }
  document.currentScript.parentNode.insertBefore(oScript, document.currentScript);
  oScript.src = sSrc;
}

…the same thing, but appending the new scripts as last childs of the <head> tag, instead of appending them immediately before the document.currentScript element:

与上面大致相同,但有一点不同的是新创建的script标签插入到了<head>标签的的最后,而不是插入到了document.currentScript元素之前:

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.onerror = loadError;
    if (fOnload) { oScript.onload = fOnload; }
    oHead.appendChild(oScript);
    oScript.src = sSrc;
  }

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

示例用法:

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

规范

Specification	Status	Comment
HTML Living Standard HTMLScriptElement	Living Standard	No change from HTML5.
HTML 5.1 HTMLScriptElement	Recommendation
HTML5 HTMLScriptElement	Recommendation	The following properties are now obsolete: `htmlFor,`.
Document Object Model (DOM) Level 2 HTML Specification HTMLScriptElement	Obsolete	No change from Document Object Model (DOM) Level 1 Specification.
Document Object Model (DOM) Level 1 Specification HTMLScriptElement	Obsolete	Initial definition.

We're converting our compatibility data into a machine-readable JSON format. This compatibility table still uses the old format, because we haven't yet converted the data it contains. Find out how you can help!

Desktop
Mobile

Feature	Chrome	Firefox (Gecko)	Internet Explorer	Opera	Safari
Basic support	1.0	1.0 (1.7 or earlier)	(Yes)	(Yes)	(Yes)
`async`	(Yes)	3.6 (1.9.2)	10	未实现	(Yes)
`defer`	(Yes)	3.5 (1.9.1)	4 (follows a spec of its own) 10 (by the spec)	未实现	(Yes)
`crossOrigin`	WebKit bug 81438	13 (13) bug 696301	未实现	未实现	WebKit bug 81438

Feature	Android	Firefox Mobile (Gecko)	IE Mobile	Opera Mobile	Safari Mobile
Basic support	(Yes)	1.0 (1.0)	(Yes)	(Yes)	(Yes)
`async`	(Yes)	1.0 (1.0)	未实现	?	(Yes)
`defer`	(Yes)	1.0 (1.0)	未实现	?	(Yes)
`crossOrigin`	?	?	?	?	?

Gecko-specific notes

　　从Gecko2.0 { { geckoRelease(" 2.0 ")} },插入脚本创建的元素通过调用document.createElement(“脚本”)到DOM不再强制执行插入顺序。这种变化让Gecko正确遵守HTML5规范。让script-inserted外部脚本执行的插入顺序,设置异步属性为false。
　　

HTMLScriptElement - Web API 接口参考编辑

Properties

Methods

例子

动态导入脚本

规范

浏览器兼容性

Gecko-specific notes

See also

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

词条统计

友情链接

HTMLScriptElement - Web API 接口参考 编辑

如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

词条统计

友情链接

HTMLScriptElement - Web API 接口参考编辑

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。