在外部javascript文件之前加载HTML

我希望在外部javascript文件执行之前完全加载HTML。 当我加载index.html时，javascript会执行，在看到html内容之前会弹出一个警报框。如何先加载HTML内容，然后获得弹出窗口

var todos=[“吃晚餐”]；
var input=prompt（“您想做什么？”）；
while（输入！=“退出”）{
如果（输入=“列表”）{
控制台日志（todos）；
}
else if（输入==“新建”）{
//询问新的待办事项
var newTodo=提示（“输入新的待办事项”）；
//添加到ToDo的数组中
todos.push（newTodo）；
}
输入=提示（“您想做什么？”）；
}
log（“好的，你退出了应用程序！：/”

1.0 Javascript kod
待办事项清单

“新建”-添加新的待办事项
“列表”-查看我的所有待办事项
“退出”-退出应用程序

如果要使用jQuery，可以将代码放入

$(document).ready(function(){
 //HERE SHOULD BE YOUR CODE
});

使用

检查DOM的纯javascript东西成功加载
（function（）{}）（）
在事件处理程序中而不是在解析时执行代码：

window.addEventListener("load", function(event){
    /* your code goes here */
});

但请记住，它也可能等待图像等加载。如果您需要在DOM树完全加载时执行某些操作，但其他操作尚未完成，请将脚本放在
之前。虽然DOM解析在技术上还没有完成，但此时它不会向树中添加任何内容。
我不想使用jQuery。必须是一种在普通JavaScript中实现这一点的方法，对吗？
必须是一种在普通JavaScript中实现这一点的方法，对吗？
可以看出jQuery是用JavaScript编写的，是的：）你可能会看到你的脚本在加载HTML后正在运行，你的问题是你的警报阻塞了主执行线程。但在运行这个代码段时，我确实首先看到了HTML。但是你可以做的是把你的脚本放在一个
setTimeout
中，让UI有机会在浏览器上呈现它没有的地方。你必须在上面创建一个按钮并触发一个函数，然后把你所有的javaScript代码都放进去，或者你可以使用javaScript或JQueryTanks中的延时函数来获得明确的答案。我现在了解了发生了什么，并将创建一个带有eventListener的按钮。
（function（）{}）（这只是一个立即调用的函数表达式，它是如何等待DOM的，你得到了这个信息吗？我认为这是一个自动执行的方法。它的工作原理类似于
$（document）.ready（function（）{}）。我使用这个
（function（）{}）（）当我使用纯js时。
$（document）.ready与之不同，它是DOM ready的简写。但是
（function（）{}）（）
不是一回事，它不会释放线程并等待DOM就绪，您会发现这与执行相同<代码>函数run（）{}
然后调用
run（）
<代码>（函数（）{}）（）通常用于创建闭包。。
window.addEventListener("load", function(event){
    /* your code goes here */
});