iT邦幫忙

2021 iThome 鐵人賽

DAY 0
0
自我挑戰組

從零開始學習 JS 的連續-30 Days-系列 第 28

[Day 28]從零開始學習 JS 的連續-30 Days---BOM-瀏覽器物件模型(下)

BOM ( Browser Object Model ) 瀏覽器物件模型

  1. BOM 核心是 window 物件
    1. window 物件提供的特性主要為
      1. document 文件物件模型
      2. history 提供進入瀏覽歷史的紀錄
      3. frames 框架用途。已從 web 標準中廢棄,要避免使用
      4. location 存取瀏覽器頁面的網址(URL)相關資訊
      5. screen 存取使用者的螢幕畫面相關資訊
      6. navigator 存取使用者的瀏覽器資訊

location 存取瀏覽器頁面的網址(URL)相關資訊

  1. 應用
    1. href 取得當前網頁的網址,常使用指定的連結或是按鈕,用於 function 內。
location.href='網址路徑'
    1. hostname 取得當前網頁的網域名稱
location.hostname='目前網域名稱'
    1. pathname 取得當前網頁的網址路徑
location.pathname='目前網址路徑'
    1. search 取得當前網頁的網址參數,如果沒有網址參數則會返回空字串,返回的參數包含問號 ?。
location.search='目前網頁的網址參數'
    1. protocol 返回 Web 協定,取得目前的網路協定。
location.protocol='目前網頁的網路協定'
    1. assign() 載入新文件,當前視窗載入一個新的網頁。
location.assign(url 網址)='載入新網頁'
    1. reload() 重新載入頁面
location.reload(forcedReload);

forcedReload 是一個布林值 (boolean),
* 1. 如果是 true ,強制瀏覽器從 server 取得最新的資料;
* 2. 預設是 false,會優先從瀏覽器暫存檔 (cache) 中取得網頁資料。

    1. location.replace() 在當前視窗載入一個新的網頁,但和 location.assign() 的差別在於,使用此方法當前網頁的瀏覽紀錄 (History) 會被新的網頁取代,使用者沒辦法按「上一頁」回去。
location.replace(url 網址)='載入新網頁';

screen 存取使用者的螢幕畫面相關資訊

  1. 瀏覽器可以獲取你正在看的網頁的相關資訊。

navigator 存取使用者的瀏覽器資訊

  1. 包含大量有關Web瀏覽器的資訊,在檢測瀏覽器及作業系統上非常有用。

frames 框架用途。已從 web 標準中廢棄,要避免使用

  1. 已被廢棄,但還是有些許的網站還在使用。今天就不多加探討。

今天就到這結束了。


上一篇
[Day 27]從零開始學習 JS 的連續-30 Days---BOM-瀏覽器物件模型(上)
下一篇
[Day 29]從零開始學習 JS 的連續-30 Days---網頁座標及應用
系列文
從零開始學習 JS 的連續-30 Days-30
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言