javascript 高級程序設計 學習筆記02章 script元素的認知
hello world:
這一章的主要內容是 學習對 script 元素的 主要功能 和 使用
script 元素 是我們用來 載入javascript 腳本代碼的 主要方式，是瀏覽器廠商為了 統一腳本代碼的嵌入 而 創造的元素。我來看看 script元素 有哪些功能和屬性吧。
html 規範 為script元素 定義了6大屬性：
1. scr 屬性（可選） 這個屬性主要目的是 通過src 指定外部腳本文件的文件地址，從而把外部文件裏的腳本代碼嵌入到html頁面當中來。如果用了src指定外部腳本文件地址 那麽這個 script元素的內嵌腳本代碼將被忽略。建議使用外部文件的方式加載腳本。
2. type屬性（可選） 這個屬性的作用是 指定script文件代碼的類型 就是(MIME)類型。一般內嵌代碼的script元素 會要求寫上 type 屬性 ，如果不寫 默認type屬性的值 就是text/javascript 也是為了統一。
3. async屬性 （可選） 異步腳本，只有當為 外部文件加載的時候 才有用 ，目的是告訴瀏覽器 立即下載此腳本，並解析執行，而不會妨礙 頁面其他資源的加載 和 頁面的渲染。用了 這個屬性的 script 元素 一定會在 頁面的load事件 之前觸發，而且不會保證 瀏覽器 會 按照頁面的script元素 出現的順序 而執行代碼。加上這個屬性後的script元素的腳本代碼，最好不要有修改dom的操作，不然可能會出大問題。
4.defer屬性 （可選） 延時腳本，只有當為 外部文件加載的時候 才有用，目的是告訴瀏覽器 立即下載次腳本，但是延時執行，加了此屬性的script元素 會等到頁面全部加載和顯示完成以後 才會執行此script嵌入的腳本代碼，如果多個script元素都運用了 此屬性的 那麽瀏覽器一般會按照 運用了defer屬性的script元素在頁面出現的順序 而解析和執行 腳本文件的代碼，但是 世事無絕對，所以一個頁面 最好只有一個defer屬性的script元素 不管是內嵌 還是外鏈 。
5.charset 屬性（可選） 是指定當前腳本文件代碼的 字符集編碼。目前已無用了。
6.language屬性 （可選） 是指當前腳本的語言，目前也已經 無用了。
當頁面中有多個script 元素的時候並且script元素 沒有defer,async屬性時 瀏覽器會 按照script元素 出現的位置 一個解析執行完畢以後 ，開始解析執行第二個 以此類推。。。
script 元素是一個 具有阻塞功能的元素 不管是內嵌還是外鏈 當瀏覽器在 下載和解析並執行一個script元素內的腳本代碼時 會停止頁面 其他資源的下載和頁面的渲染，所以我們的做法是 通常把script元素的腳本代碼放在 </body>標簽之前 內容之後。即使加上了defer,async屬性 也最好放在這個位置。
外部js文件 的後綴並不是 必須的 所以我們可以用 jsp php來嵌套 讓服務器端 動態生成js文件 但是一定要服務器端 返回正確的MIME類型。
script 元素的 src屬性 是一個神奇的屬性，可以用來加載不同域的 文件內容 叫做跨域 其實跨域並不是 script的專長 而是src屬性的 技能，就像img元素 一樣 img元素的src屬性 和 script元素的src是一樣的 都具有跨域訪問和下載資源的技能。
但是這也為 網頁帶來了一定的安全隱患 如果要用 src屬性來跨域 那麽要麽其他域是我們自己掌控的 要麽是我們信任的，否則會出大問題。
還有種情況就是 在script代碼內嵌腳本代碼的時候 在xhtml中和html中 使用腳本代碼的解析規則是不一樣的 。如果是內嵌腳本代碼 那麽在xhtml中 一定要把 所有特殊字符 轉換成為 實體的字符。不然會報錯誤 。但是如果是 外部鏈接 那麽xhtml和html的解析規則就是一樣的 不用做轉換。
詳細看看 script內嵌和外鏈的好處：
使用外鏈腳本文件的好處 就是：
1. 可維護性：開發人員 做到了 行為和結構分離，集中編寫腳本 ，更容易維護。
2. 緩存：用外部鏈接的方式 可以通過 指定緩存鏈接來緩存 我們指定的 文件。（適用於離線開發），減少請求量，加快網頁的加載速度。
3.用了外部鏈接以後 html 和 xhtml對 外部腳本代碼的解析規則就是一樣的了 不用再做 hack和 字符轉換。
最後是 如果瀏覽器不支持 腳本 那麽 就用<noscript>請開啟腳本的使用！！！</noscript>
如果瀏覽器支持腳本 那麽這段html元素就不會出現在用戶的眼前。
好了 今天就學習到這裏吧。明天繼續，加油。
javascript 高級程序設計 學習筆記02章 script元素的認知