为什么我的 JS 脚本只有在链接到 "head" 部分时才有效？

Question

昨天我问了一个问题，谁的回答是"your JS isn't linked properly"。现在我的问题是：为什么脚本只在 link 位于 head 部分而不是 body 部分时加载？我被教导将它们放在 body 的最底部，像这样：

<!DOCTYPE html> 
<html lang="en">
<head>
    <title>Number Crunchers</title>
    <meta charset="utf-8">
    <meta class="meta" name="viewport" content="width=device-width, initial-scale=1">
    <link rel="stylesheet" href="css/uikit.css" />
    <link rel="stylesheet" type="text/css" href="css/newcustom.css">
    <link rel="stylesheet" type="text/css" href="css/cards.css">
    <!--
    <script src="js/uikit.min.js"></script>
    <script src="js/jquery.min.js"></script>
    -->
</head>
<body>
    <!--Page Content-->

    <script src="js/uikit.min.js"></script> 
    <script src="js/jquery.min.js"></script>
</body>
</html>

当script在底部时是没有任何作用。但是，当我将它与顶部的那些放在一起时，一切正常。为什么？

Answer 1

在 </body> 之前加载它们是可以的，问题是 jquery 应该是第一个，而且你还有一些打字错误（见下面的 img）会破坏代码，因此他们会仅在这些之前加载（在 <head> 时）

<body>
<!--Page Content-->
        ...
<!--Javascript to make the world go round -->
<script src="js/jquery.min.js"></script>
<script src="js/uikit.min.js"></script> 
</body>
</html>

在此处查看这些拼写错误（在 "check" 之后和 "program" 之后）：

为什么我的 JS 脚本只有在链接到 "head" 部分时才有效？

Why are my JS scripts only working when linked within the "head" section?

html

javascript

css

jquery

getuikit