js中DOM操作和js盒子模型

2021-09-26 14:31:53 字數 1398 閱讀 3783

獲取元素或者元素集合

getelementbyid

->上下文只能是document(只有document這個例項的原型鏈上才能找到這個方法,其它例項都找不到)

-id重複了獲取第乙個

->ie6-7中會把表單元素的name當做id使用

getelementsbytagname

->獲取當前上下文中,所有子子孫孫中簽名叫做*** 的元素

getelementsbyclassname

->ie6-8中不相容

getelementsbyname

->在ie瀏覽器中只對表單元素的name 起作用

->上下文也只能是document

queryselector

queryselectorall

* ->不相容ie6-8

->沒有dom對映

document.documentelement

document.body

document.head

描述節點和節點之間關係的屬性

元素節點1 大寫標籤名 null

文字節點3 #text 文字內容

注釋節點8 #comment 注釋內容

文件節點9 #document null

childnodes:所有節點

children:所有元素子節點(ie6-8中會把注釋當作元素節點)

previoussibling/previouelementsibling

nextsibling

firstchild

lastchild

[動態操作dom]

createelement

createdocumentfragment

insertbefore

clonenode(true/flase)

removechild

set/get/removeattribute

散 ***.style.***=***設定行能樣式

***.style.*** 獲取行內樣式

***.classname='***'

***.onclick=function.

js 盒子模型屬性

在js 中通過相關的屬性可以獲取(設定)元素的樣式資訊,這些屬性就是盒模型(基本上都有關於樣式的)

client

top left width height

offset

top left width height parent

scroll

top left width height

js盒子模型

通過js中提供一系列的方法和屬性獲取頁面中元素的樣式資訊值 內容的寬高 是給元素定義的width height這兩個樣式。如果沒有設定height值,容器的高度會根據裡面內容自己適應,這樣獲取的值就是真實的內容的高 如果設定固定的高度,不管內容是多少,內容的高度指的都是設定的這個值 真實內容的寬高 ...

js盒子模型

js盒子模型是指通過js中一系列的屬性和方法獲取頁面中元素的樣式資訊值 1 client系列 clientwidth 設定的寬度 width 內邊距 padding 2 clientheight 設定的高度 height 內邊距 padding 2 clientleft 左邊框的寬度 border的...

JS盒子模型

clientwidth 盒子寬度 左右的padding clientheight 盒子高度 上下的padding clientleft 盒子左邊框的寬度 clienttop 盒子上邊框的寬度 offsetwidth clientwidth 左右border offsetheight clienthe...