如何引用加载当前运行的javascript的脚本元素?
这是情况.我在页面中加载了一个"主"脚本,首先是在HEAD标记下.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<script type="text/javascript" src="scripts.js"></script>
Run Code Online (Sandbox Code Playgroud)
"scripts.js"中有一个脚本,它需要能够按需加载其他脚本.普通方法对我来说并不适用,因为我需要添加新脚本而不引用HEAD标记,因为HEAD元素还没有完成渲染:
document.getElementsByTagName('head')[0].appendChild(v);
Run Code Online (Sandbox Code Playgroud)
我想要做的是引用加载当前脚本的脚本元素,以便然后我可以将新的动态加载的脚本标记添加到DOM之后.
<script type="text/javascript" src="scripts.js"></script>
loaded by scripts.js--><script type="text/javascript" src="new_script1.js"></script>
loaded by scripts.js --><script type="text/javascript" src="new_script2.js"></script>
Run Code Online (Sandbox Code Playgroud) 假设script脚本运行时文档中的最后一个元素*是当前运行的脚本是否安全?
例如,我想创建一个脚本,可以将其放在页面正文的任何位置,并在同一个地方显示一个元素.我正在做这样的事情:
function getCurrentScriptElement() {
var scripts = document.getElementsByTagName('script');
return scripts[scripts.length - 1];
}
var script = getCurrentScriptElement();
var view = document.createElement('span');
/* Put stuff in our view... */
script.parentNode.insertBefore(view, script);
Run Code Online (Sandbox Code Playgroud)
假设脚本在文档正文中,这是"安全吗?" 该getCurrentScriptElement函数是否总是返回正在运行的脚本?如果没有,怎么办呢?
我想这样做而不将脚本绑定到特定的id属性或类似属性,我希望它只是位置.
我在这里创建了一个示例来拉入此脚本.一个答案表明,其他脚本可能会创建一个像这样的例子会破坏的情况.是否可以在此示例中添加其他脚本来破坏它?
有人建议其他带有defer或async属性的脚本可能会破坏这一点.任何人都可以举例说明这样的脚本是如何工作的吗?
据我了解,defer意味着首先加载DOM,然后使用defer标记运行脚本.defer出现在另一个脚本元素上的属性如何影响getCurrentScriptElement?的行为?
async,据我所知,意味着开始获取该脚本并同时保持解析DOM,不要等待......但是当它到达我的脚本时它应该仍然停止并等待,对吧?
我不知道任何一个人如何影响它,任何人都能提供一个例子吗?
*出于此问题的目的,我只对外部脚本感兴趣.
**不是script整个文档中的最后一个script元素,而是运行时文档中的最后一个元素.该文档的其余部分尚未加载,对吧?
可能重复:
我如何引用加载当前正在执行的脚本的脚本标记?
有没有办法选择script包含特定脚本的元素而不给它任何类型的已知属性?
此示例将警告窗口对象,因为它在全局上下文中被调用:
<script>
alert(this);
</script>
Run Code Online (Sandbox Code Playgroud)
这个例子不会起作用,因为脚本的名称可能会改变(为方便起见,我假设包含了jQuery):
<script type="text/javascript" src="/foo/bar/baz.js"></script>
//baz.js
$('[src^="baz.js"]');
Run Code Online (Sandbox Code Playgroud)
此示例是次优的,因为它依赖于id属性:
<script type="text/javascript" id="foo">
$('#foo');
</script>
Run Code Online (Sandbox Code Playgroud) 是否可以将一个 HTML 元素嵌入到文档的多个位置,就像 MediaWiki 中那样?我想将元素包含在其他元素中,而不复制和粘贴其内容。我知道可以使用 iframe 将网页嵌入到其他网页中,但是有没有可靠的方法可以在同一页面上将 HTML 元素嵌入到其他 HTML 元素中?
<p id = "p1">This is paragraph 1. </p>
<p id = "p2">
This is paragraph 2.
</p>
<p id = "p3">This is paragraph 3. It should contain paragraphs 1 and 2.
<!-- {{p1}} {{p2}} -->
</p>
Run Code Online (Sandbox Code Playgroud)