前端培訓-中級階段(4)- BOM 瀏覽器對象模型(2019-07-04期)

前端最基礎的就是 HTML+CSS+Javascript。掌握了這三門技術就算入門,但也僅僅是入門,如今前端開發的定義已經遠遠不止這些。前端小課堂(HTML/CSS/JS),本着提高技術水平,打牢基礎知識的中心思想,咱們開課啦(每週四)。前端

前面咱們已經基本掌握常規的語法語義,以及基本的使用方法。接下來咱們講深刻進去了解其中內在的原理。正則表達式

上一節,咱們聊了聊 DOM對象。這節咱們來了解一下 BOM對象(瀏覽器對象)。
BOM對象其實就是咱們的 window對象segmentfault

咱們要講什麼?

  1. BOM對象是什麼?
  2. BOM對象上的屬性

BOM對象是什麼?

BOM(Browser Object Model)中文瀏覽器對象模型
表示一個包含 DOM文檔的窗口。提供了與瀏覽器窗口進行交互的對象
標籤之間不會共享。
window 對象既是ECMAScript規範中的Global對象,也是BOM中的頂級對象;
clipboard.pngapi

BOM對象上的屬性

document

指向窗口中載入的 DOM文檔(document.defaultView 屬性能夠獲取指定文檔所在窗口。)瀏覽器

console

提供了對瀏覽器調試控制檯的訪問。緩存

  1. 低版本IE米有
  2. 打印的對象,會形成內存泄露。線上儘量不使用。

history

history對象的引用。用於描述當前瀏覽器的歷史記錄。
只提供了有限的 api不提供訪問,修改等操做微信

  1. length 表示當前歷史記錄個數
  2. back() 後退
  3. forward() 前進
  4. go() 0 1 -1 等參數。

location

當前加載頁面的url、端口、協議等信息。還能夠對當前的窗口進行導航。cookie

  1. href 獲取或者設置,網頁的url
  2. reload() true爲放棄緩存刷新,默認爲普通屬性
  3. replace() 替換,不會再history留下記錄
  4. assign() 等價於直接設置href

navigator

返回當前瀏覽器相關信息。包括瀏覽器的名稱、版本、語言、系統平臺、用戶特性字符串等信息。session

screen

返回客戶端屏幕參數。函數

frames

頁面中其餘 iframe 的引用

其餘經常使用

  1. devicePixelRatio
    返回當前顯示器的物理像素和設備獨立像素的比例。
  2. fullScreen
    表示窗口是否以全屏顯示。
  3. localStorage&sessionStorage
    本地存儲
  4. opener
    返回對打開當前窗口的那個窗口的引用(open打開頁面)
  5. performance
    檢測網頁加載速度

微信公衆號:前端linong

clipboard.png

初級階段文章目錄

  1. 前端培訓-初級階段(17) - 數據存儲(cookie、session、stroage)
  2. 前端培訓-初級階段(13) - 正則表達式
  3. 前端培訓-初級階段(13) - 類、模塊、繼承
  4. 前端培訓-初級階段(13) - ECMAScript (內置對象、函數)
  5. 前端培訓-初級階段(13) - ECMAScript (語法、變量、值、類型、運算符、語句)
  6. 前端培訓-初級階段(1三、18)
  7. 前端培訓-初級階段(9 -12)
  8. 前端培訓-初級階段(5 - 8)
  9. 前端培訓-初級階段(1 - 4)

中級階段文章目錄

  1. 前端培訓-中級階段(2) - 事件(event) 事件冒泡、捕獲 - (2019-06-20期)
  2. 前端培訓-中級階段(3) - DOM 文檔對象模型(2019-06-27期)
相關文章
相關標籤/搜索