首頁  >  文章  >  web前端  >  關於script在html中的擺放位置解析

關於script在html中的擺放位置解析

小云云
小云云原創
2017-12-11 11:37:171589瀏覽

以前一直覺得script在html的任何位置都可以,今天做一個需求的時候才更正了自己的錯誤思想啊--script的位置也不是隨便放的。本文主要談論關於script在html中的擺放位置。小編覺得蠻不錯的,現在就分享給大家,也給大家做個參考。希望能幫助大家。

首先是想實作一個select標籤,有是和無兩個option,但是在初始化的時候要求select標籤預設選擇空值,所以我在點擊的時候加了一個方法讓他把空值刪除:


XML/HTML Code複製內容到剪貼簿


    ##
    <!DOCTYPE html>
    <html>
    <head>
    <script src="jquery/jquery-1.11.1.min.js"></script>
    </head>
    <script>
    $('#checkcash').click(function () {   
            if ($('#checkcash').val() == '0') {   
                $("#checkcash option[value='0']").remove();   
            }   
        });   
        $("#alert").click(function(){   
        alert("1123");   
        })   
    </script>
    <body>
     是否已提现 <select id="checkcash"   style="width: 181px">
                                <option selected="selected" value="0"></option>
                                <option value="1">是</option>
                                <option value="2">否</option>
                                </select>
                                <input type=&#39;button&#39; id=&#39;alert&#39; value="anwo">
    </body>
    </html>


#但是這樣並不能達到想要的效果,起初以為是jquery語法錯誤還一直在網上查,改,但是都不管用,後來突然想到是不是應該把script放到後面,試了一下,結果果真ok了,這才恍然大悟,原來不是這樣的。

後來查了一下原因是因為,html檔案是自上而下的執行方式,但引入的css和javascript的順序有所不同,css引入執行載入時,程式仍然往下執行,而執行到