# 瀏覽器裡的 JavaScript ###### tags: `JavaScript` `JS 直播班 - 2021 秋季班` ## <font color=#9B1272> JavaScript怎麼操作網頁 </font> JavaScript並沒有提供操作網頁的方法,網頁的操作方法都是由<font color=red>**"瀏覽器"**</font>( JavaScript 操作平台提供的) 網頁的操作方法基本上分別由兩種物件來擁有 1. BOM ( Browser Object Model ) 2. DOM ( Document Object model ) 所以說 瀏覽器上的JS包含: * JavaScript 核心 (以 ECMAScript 標準為基礎) * BOM (Browser Object Model,瀏覽器物件模型) * DOM (Document Object Model,文件物件模型) 運作原理: 開發者透過JS去呼叫BOM或是DOM提供的API,透過API對瀏覽器做行為上的控制或是更改網頁內容~ ## [BOM傳送門!](https://hackmd.io/0pQfQGYzRaauZEwu9AE6UA?edit) ## [DOM傳送門!](https://hackmd.io/IxkeD3N4TbqSoJArAW1jRw) ## <font color=#9B1272> DOM 跟 BOM 的差異 </font> ![](https://i.imgur.com/88Rdiez.png) 其實 DOM 也是 WINDOW 物件下的子物件 <font color="red">**但兩者最大的差異在於:**</font> **BOM: JavaScript 與「瀏覽器」溝通的窗口,不涉及網頁內容。** **DOM: JavaScript 用來控制「網頁」的節點與內容的標準。** # 參考資料 [重新認識 JavaScript: Day 11 前端工程師的主戰場:瀏覽器裡的 JavaScript](https://ithelp.ithome.com.tw/articles/10191666) [D21 - 走!去瀏覽器吃 好味雙響 BOM DOM 飯](https://ithelp.ithome.com.tw/articles/10278416?sc=iThelpR) [DAY 2 BOM 、 DOM 是什麼?](https://ithelp.ithome.com.tw/articles/10235079)