l瀏覽器執行JS

瀏覽器執行JS

1. 瀏覽器分成兩部分：渲染引擎和JS引擎

   • 渲染引擎：用來解析HTML與CSS，俗稱內核，比如chrome瀏覽器的blink，老版本的webkit

   • JS引擎：俗稱JS解析器。用來讀取網頁中的JS代碼，對其處理後運行，比如chrome瀏覽器的V8

   • 【註意】

     瀏覽器本身並不會執行JS代碼，而是通過內置JavaScript引擎來執行JS代碼。JS引擎執行代碼時逐行解釋每一句源碼，然後由電腦去執行，所以Javascript語言歸為腳本語言，回逐行解釋執行

2. JS的組成

   • ECMAScript
     • JavaScript語法
     • 是由ECMA國際進行標準化的一門編程語言，這種語言在萬維網上應用廣泛，他往往被稱為JavaScript
   • DOM
     • 頁面文檔對象模型
     • 通過DOM提供的介面可以對頁面上的各種元素進行操作（大小位置顏色）
   • BOM
     • 瀏覽器對象模型
     • 通過BOM可以操作瀏覽器視窗，比如彈出框，控制瀏覽器跳轉，獲取解析度

3. js書寫位置

   • 行內

   • <input type="button" value="Hello" onclick="alert('World')" />

     • 可以將單行或少量JS代碼寫在HTML標簽的時間屬性中（以on開頭的屬性），如：onclick
     • 註意單雙引號的使用；在HTML中我們推薦使用雙引號，JS中我們推薦使用單引號
     • 可讀性差，在HTML中編寫JS大量代碼時，不方便閱讀
     • 引號易錯，引號多層嵌套，非常容易弄錯
     • 特殊情況下使用

   • 內嵌

   • <script>
         alert('Hello World');
     </script>

     • 可以將多行JS代碼寫到<script> 標簽中
     • 內嵌JS是學習是常用的方式

   • 外部

   • <script src="js代碼路徑">
     </script>

     • 利與HTML頁面代碼結構化，把大段JS代碼獨立到HTML頁面之外，既美觀，也方便文件級別的復用
     • 引用外部JS文件的script標簽中間不可以寫代碼
     • 適合於JS代碼量比較大的情況

4. 註釋

   • 單行註釋：//
   • 多行註釋：/**/

5. JavaScript輸入輸出語句

   方法	說明	歸屬
   alert（msg）	瀏覽器彈出警示框	瀏覽器
   console.log(msg)	瀏覽器控制台列印輸出信息	瀏覽器
   prompt(info)	瀏覽器彈出輸入框，用戶可以輸入	瀏覽器