Vue中直接操作DOM元素操作

2021-10-06 14:52:00 字數 1289 閱讀 3970

"oid"

class

="cla"

>

<

/div>

'input' name=

'age'

>

var odiv=document.

getelementsbytagname

('div'

)//獲取div標籤的偽陣列

var oinput=document.

getelementsbyname

('age'

)// 獲取 name屬性偽陣列(系統自帶也可以人為新增)

var odiv1=document.

getelementsbyclassname

('cla'

)//獲取cla類的偽陣列

var odiv2=document.document.

getelementbyid

('oid'

)//獲取id為oid的例項

var odiv3=document.

queryselector

('div#oid'

)//獲取div標籤的第乙個

var odiv4=document.

queryselector

('.cla'

)//獲取類.cla標籤的第乙個

var odiv5=document.

queryselector

('#oid'

)//獲取#oid標籤

var odiv6=document.

queryselectorall

('div'

)//獲取div標籤的偽陣列

var odiv7=document.

queryselectorall

('.cla'

)//獲取.cla標籤的偽陣列

var odiv8=document.

queryselectorall

('#oid'

)//獲取#oid標籤的偽陣列

document.documentelement 獲取html

document.body 獲取body...

<

/script>

'odiv'

>

<

/div>

export

default)}

,mounted()

}

ref其他使用

1.獲取自定義元件例項,呼叫自定義元件方法

Dom元素操作

把建立的p元素新增到父元素box裡 btn1.onclick function 移除父元素裡的p元素 插入元素 insertbefore 被插入的元素,參照元素 var dom document.getelementbyid dom var newdom document.createelement...

vue中獲取並操作dom元素

獲取dom元素可以使用 elementlist document.queryselectorall selectors 獲取多個dom元素 如ul中的lielement document.queryselector selectors 獲取dom元素中的第乙個元素在vue中使用 mounted 要在...

DOM元素的操作

dom元素的操作有動態建立dom元素,子父元素操作,dom元素追加,屬性設定等等.前面詳細的總結了dom元素的獲取方式,這裡複習總結一下下.使用createelement 方法建立元素 語法 document.createelement nodename 引數 nodename 引數描述 必須。建立...