HTML导入中的Javascript不影响导入的HTML [英] Javascript inside HTML import not affecting imported HTML
问题描述
我正在从index.html
文件中的脚本导入html文档form.html
.
I am importing an html document, form.html
, from a script located in my index.html
file.
form.html
基本上是HTML的一部分,并且在html的底部是将html附加到主文档的内部脚本:
form.html
is a basically a fragment of HTML and at the bottom of the html is an internal script that attaches the html to the main document:
然后,我引用一个外部脚本,该脚本应该对form.html
中的HTML进行一些处理.但是,这不会对Firefox产生影响.
Afterwards, I reference an external script that is supposed to do some stuff to the HTML in form.html
. However, this fails to have an affect in Firefox.
如果我在Firefox开发人员工具中检查了主文档的<head>
,则可以看到文档片段"的组成和正确的脚本影响.但是,出现在 body 中的实际导入的HTML不会受到影响.
If I inspect the <head>
of the main document in Firefox developer tools, I can see the "document fragment" composed and with the correct scripting affect. However, the actual imported HTML that appears in the body is unaffected.
我尝试内联form.html
底部的脚本.我还尝试使用window.onload
将外部脚本附加到主文档的body
末尾,以及尝试根据
I have tried inlining the script at the bottom of form.html
. I also tried using window.onload
to attach the external script to the end of the body
of the main document as well as trying to use a link
tag as per this question.
不太确定还有什么尝试.我想使脚本保持模块化并包含在form.html
内,以便仅在请求该HTML页面时请求它.
Not quite sure what else to try. I would like to keep the script modular and contained inside form.html
if possible as to only request it when that HTML page is requested.
谢谢
推荐答案
使用 HTML导入polyfill ,则导入文档的处理仅是异步的.因此,您应该等待HTMLImportsLoaded
事件或使用HTMLImports.whenReady()
方法来确保内容已导入.
When using the HTML Imports polyfill, the processing of the imported document is only asynchronous. So you should wait for the HTMLImportsLoaded
event or use the HTMLImports.whenReady()
method to be sure the content was imported.
<head>
<script src="html-imports.min.js"></script>
<link rel="import" src="from.html">
<body>
//code to be injected
<script>
document.addEventListener( 'HTMLImportsLoaded' , ev => {
//you can safely access the imported code in the body
} )
</script>
这篇关于HTML导入中的Javascript不影响导入的HTML的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!