當我不將它放在jQuery（document）.ready中時，jQuery無法正常工作

Question

jQuery(document).ready(function(){
    jQuery(".test").click(function() {
        alert(1);
    });
});

當我嘗試不放時：

jQuery(".test").click(function() {
            alert(1);
        });

在jQuery(document).ready()將無法正常工作。

你覺得那個原因是什么？ 我已經加載了具有該功能的自定義腳本。

<script type="text/javascript" src="/scripts/js/jquery.js"></script>
<script type="text/javascript" src="/scripts/js/customScript.js"></script>

任何答案都將得到贊賞和獎勵。

謝謝！

Answer 1

如果你在<head>加載它，那么你的.test在你的代碼執行時還沒有加載。 因此， jQuery(".test")返回[] ，因此click事件無法附加。 如果將<script>移動到<body>的最后一個，它應該可以工作。

Answer 2

您看到的行為是正常和正確的。

當你說：

jQuery(".test").click(function() {
   alert(1);
});

這意味着“發現生存權現在用類‘測試’，並分配一個單擊處理程序，以這些元素的所有元素”。 如果您將此類代碼放在文檔之外，那么瀏覽器將不會解析該腳本之后的任何HTML，因此它不會找到頁面下方定義的任何元素 - 它們尚未存在於DOM中。

將代碼放在document.ready（或onload事件處理程序）中意味着在整個頁面被解析之前它不會運行，此時所有元素都將存在並且可以從代碼中訪問。 （如果將所有HTML放在頁面底部，也可以使用它。）