我有一个带有一些handlebars模板脚本的index.html文件（和同一目录中的handlebars.js文件。 。它仅在其中起作用，为什么？是否因为此时尚未渲染DOM？
这有效（但如果将带有“ script id =“ quoteTemplate” .....的零件，直到document.getElementById（..）”放置在主体下，则不起作用...：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Handlebars Tutorial</title>
<style type="text/css">
.redText {color: red;}
.blueText {color: blue;}
.greenText {color: green;}
</style>
<script src="handlebars-v4.7.6.js"></script>
</head>
<body>
<h1>First handlebars tutorial...</h1>
<div id="marcData"></div>
<br>
<div id="quoteData"></div>
<script id="quoteTemplate" type="text/x-handlebars-template">
<h3>Favorite {{name}} Quotes</h3>
<ol>
{{#each quotes}}
<li>{{quote}}</li>
{{/each}}
</ol>
</script>
<script type="text/javascript">
let quoteInfo = document.getElementById("quoteTemplate").innerHTML;
let template = Handlebars.compile(quoteInfo);
let quoteData = template({
name: "Yogi Berra",
quotes: [
{ quote: "First quote" },
{ quote: "Second quote" },
{ quote: "Third quote" },
{ quote: "Fourth quote" },
{ quote: "Fifth quote" },
{ quote: "Sixth quote" }
]
});
document.getElementById("quoteData").innerHTML += quoteData;
</script>
</body>
<script type="text/javascript" src="src/js/first.js"></script>
</html>
我很确定这是您所认为的渲染效果。
[如果您将某物放置在主体之外/之后，浏览器会“思考”，则可能只是放错了位置，并尝试像在主体内部一样处理它。