BOM（Browser Object Model）: 瀏覽器對象模型

瀏覽器介紹

JavaScript 和 瀏覽器關系？
JavaScript 誕生就是為了能夠讓他在瀏覽器中運行！

內核：

• IE 6~11
• Chrome
• Safari
• FireFox

第三方瀏覽器（可以換上面的內核）：

• QQ 瀏覽器
• 360瀏覽器

window (重要)

window 代表 瀏覽器窗口

window.alert(2) undefined window.innerHeight 184 window.innerWidth 730 window.outerHeight 768 window.outerWidth 956 // 瀏覽器窗口大小

Navigator

Navigator, 封裝了瀏覽器的信息

navigator.appName "Netscape" navigator.appVersion "5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/92.0.4515.131 Safari/537.36" navigator.platform "Win32" navigator.userAgent "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/92.0.4515.131 Safari/537.36"

大多數時候，我們不會使用navigator對象，因為會被人為修改！
不建議使用這些屬性來判斷和編寫代碼

screen

代表屏幕尺寸

screen.width 1536 screen.height 864

location (重要)

location代表當前頁面的URL信息

host: "www.baidu.com" href: "https://www.baidu.com/" protocol: "https:" reload: ? reload() // 刷新網頁 // 設置新的地址 location.assign("https://juejin.cn/")

document

document 代表當前的頁面， HTML、DOM文檔樹

document.title "百度一下，你就知道" document.title = 'wang' "wang"

獲取具體的文檔樹節點

<dl id="app"><dt>java</dt><dd>JavaSE</dd><dd>JavaEE</dd> </dl> <script>let dl = document.getElementById("app")console.log(dl) </script>

獲取cookie

document.cookie "BIDUPSID=708BC2 ........."

服務器端可以設置cookie: httpOnly，防止cookie被劫持

history (不建議使用)

history 代表瀏覽器的歷史記錄

history.back() // 后退 history.forward() // 前進

https://www.bilibili.com/video/BV1JJ41177di?p=19

總結

以上是生活随笔為你收集整理的JavaScript-操作BOM对象的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。