HTML DOM和BOM常用操作總結
HTML DOM和BOM常用操作總結
HTML DOM常用操作
getElementById（）//返回帶有指定 ID 的元素。
element。getElementsByTagName（）//返回擁有指定標籤名的所有子元素的集合。
getElementsByClassName（）//返回包含帶有指定類名的所有元素的節點列表。
element。appendChild（）//向元素新增新的子節點，作為最後一個子節點。
element。removeChild（）//從元素中移除子節點。
element。replaceChild（）//替換元素中的子節點。
createAttribute（）//建立屬性節點。
createElement（）//建立元素節點。
createTextNode（）//建立文字節點。
element。getAttribute（）//返回元素節點的指定屬性值。
element。setAttribute（）//把指定屬性設定或更改為指定值
element。offsetHeight//返回元素的高度。
element。offsetWidth//返回元素的寬度。
element。offsetLeft//返回元素的水平偏移位置。
element。offsetTop//返回元素的垂直偏移位置。
element。scrollHeight//返回元素的整體高度。
element。scrollLeft//返回元素左邊緣與檢視之間的距離。
element。scrollTop//返回元素上邊緣與檢視之間的距離。
element。scrollWidth//返回元素的整體寬度。
element。clientHeight//返回元素的可見高度。
element。clientWidth//返回元素的可見寬度。
element。childNodes//返回元素子節點的 NodeList。
element。className//設定或返回元素的 class 屬性。
element。id//設定或返回元素的 id。
element。innerHTML//設定或返回元素的內容。
element。insertBefore（）//在指定的已有的子節點之前插入新節點。
HTML DOM和BOM常用操作總結
常用的BOM屬性
window
視窗
window。open（）//開啟視窗。返回一個指向新視窗的引用。
window。close（）//關閉視窗。
window。resizeTo（）//調整視窗尺寸到指定值
window。resizeBy（）//增加視窗尺寸，增加量為指定值
window。moveTo（）//移動視窗
window。moveBy（）//移動視窗，座標增加量為指定值
window。innerHeight//瀏覽器視窗的內部高度
window。innerWidth//瀏覽器視窗的內部寬度
window。setTimeout（）//超時呼叫
window。clearTimeout（）//取消超時呼叫
window。setInterval（）//間歇呼叫
window。clearInterval（）//取消間歇呼叫
window。alert（）//警告框
window。confirm（）//確認對話方塊。返回布林值，點選確定返回true，點選取消返回false
window。prompt（）//提示框。點選確定返回文字框的值，點選取消返回null
window。print（）//列印對話方塊
window。find（）//查詢對話方塊
location。href//完整URL，如//www。yinzitang。com：8080/index。html？name=‘peter’&age=‘20’#contents
location。protocol//協議名，如
location。hostname//伺服器名，如www。yinzitang。com
location。host//伺服器名及埠號，如www。yinzitang。com：8080
location。port//埠號，如8080
location。pathname//目錄和檔名，如/path/to/homepage/index。html
location。search//查詢字串，以問好開頭，如？name=‘peter’&age=‘20’
location。hash//雜湊值，即#號後面，如#contents
location。assign（）//開啟指定URL，並在歷史記錄中生成一條記錄。等價於location。href = URL和window。location = URL。
location。replace（）//開啟指定URL，但不生成新的歷史記錄。
location。reload（）//重新載入當前頁面。預設以最有效的方式載入，可能會請求到快取。
location。reload（true）//重新載入當前頁面，強制從伺服器重新載入。
navigator。userAgent//使用者代理字串
navigator。plugins//安裝外掛資訊的陣列
navigator。onLine//檢測裝置線上還是離線
screen。availWidth//可用的螢幕寬度。以畫素計，減去介面特性，比如視窗工作列。
screen。availHeight//可用的螢幕高度。以畫素計，減去介面特性，比如視窗工作列。
screen。width//螢幕的畫素寬度
screen。height//螢幕的畫素高度
screen。colorDepth//顏色位數
history。go（）//跳轉到任意歷史記錄。
若傳入整數，正數為前進，負數為後退。
若傳入字串，則跳轉到歷史記錄中包含該字串的第一個位置。
history。back（）//後退一頁
history。forward（）//前進一頁
history。length//歷史記錄的數量。對於視窗中第一個開啟的頁面而言，其history。length為0。
history。pushState（）//歷史狀態管理。將新的狀態資訊加入歷史狀態棧。
history。replaceState//歷史狀態管理。重寫歷史狀態。
HTML DOM和BOM常用操作總結
以上內容為網際網路收集多謝支援與關注。
