Question

我正在寻找一个解决方案（jQuery或普通JS），它允许在完全加载（！）DOM之前将HTML / JS-Content加载到给定的DIV中。

<script>
$(document).ready(function() {
var mywidth = $(window).width();
if(mywidth > 1000) {
$("#mydiv").load("some_html_with_external_javascript.html");
}
});

这当然很好 - 当然。但是如果加载的内容包含外部JS，则不执行JS-Content。我需要像JS和PHP这样的东西，比如：

<div id="mydiv">
<script>
var mywidth = $(window).width();
if(mywidth > 1000) {
// <?php require_once "some_html_with_external_javascript.html"; ?>
}
</script>
</div>

Answer 1

您可以使用document.write来执行此操作。只需在当前位置插入一个新的脚本标记，该标记在下一个（脚本）标记之前执行（非常类似于php代码）。根据您的问题，请求的脚本同步加载。

<强>的index.html：

<script>
console.log("first")
document.write('<script src="second.js"><\/script>')
</script>
<script>
console.log("third")
</script>

<强> second.js：

console.log("second")

在记录“third”之前，浏览器控制台将首先加载 second.js 。因此，输出正如预期的那样：

“第一”
“第二”
“第三”

我想补充一点，如果可能的话，应该避免同步加载。这是一个巨大的性能瓶颈。

jQuery / JS在文档就绪之前加载内容

1 个答案: