如何分离HTML和Javascript
如何分离HTML和Javascript
提问于 2020-02-15 02:09:24
我现在正在设计JS的样式。我需要得到尽可能多的HTML和JS得到分离。所以一切都在一个HTML和一个松散的JS文件中。我如何将其分离：
<!DOCTYPE html>
<html>
<head>
<title>Inzendopgave 242S2 - F.W.J.C. de Graaff
<script async src="script.js"></script>
</title>
</head>
<body>
<h2>Inzendopgave 242S2 - F.W.J.C. de Graaff</h2><br/>
<p>Voer uw bedragen in:<br/></p>
<input type="text" id="invoer1">
<script>
//Maak een globale variabele:
const bedrag = document.getElementById("invoer1");
//Voeg er een event-listener aan toe:
bedrag.addEventListener("keyup", function(event) {
//Alleen triggeren als de Enter-toets wordt gedrukt:
if (event.key === "Enter") {
//Dan voer het volgende script uit:
//Maar een Block variabele en geef deze de waarde van de ingevoerde string:
let uitkomst = document.getElementById("afvoer2").innerHTML;
//Tel de invoer bij de uitkomst op en maak van de strings integers (getallen):
document.getElementById("afvoer2").innerHTML = parseInt(uitkomst) + parseInt(bedrag.value);
//Maak invoerveld weer leeg:
bedrag.value = "";
//Sluit alle nog openstaande regels/tags:
}
}
)
//Puntkomma om de event-listener te sluiten:
;
</script>
<h3>Uw ingevoerde totaal:</h3><br/>
<div id="afvoer2">0</div>
</body>
</html>
</code>当我将脚本标记中的所有内容都保存到单独的js文件中时，事件侦听器就不再起作用了……那么有没有可能把它分开呢？
问候--Tech
回答 2
Stack Overflow用户
回答已采纳
发布于 2020-02-15 02:14:52
将所有的Javascript代码放在单独的myScriptFile.js文件中。将脚本包含在<body>标记的末尾，如下所示：
<html>
<head></head>
<body>
<script src='/path/to/myScriptFile.js'></script>
</body>
</html>Stack Overflow用户
发布于 2020-02-15 02:21:03
当您使用内联javascript时，文档正在呈现，所以如果您通过script标记之前存在的ID引用一个元素，那么该元素很可能已经被注册，这就是为什么您可以将一个事件侦听器附加到它。当您链接外部javascript文件时，它通常会在文档呈现之前加载，因此元素还不存在。要解决此问题，只需在加载文档后运行将事件侦听器附加到文档元素的代码即可。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/60231507
复制相关文章
相似问题
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号