uni-app gets dom node information

Problem Description

uni-app无法获取dom节点信息

Operate dom nodes according to native js

<video id="video" playsinline style=" display: block;"></video>
onload(){
    
    
	const video = document.getElementById('video');
}

insert image description here


Cause and Solution

uniapp does not support native operation dom, but provides an interface to obtain dom information

insert image description here


注意:想要拿到元素实例,需要在实例已经挂载到页面上才可以

onLoad() { //page initialization execution, user page acquisition parameters},
onReady() { //page execution after initial rendering},

Implementation process

getVideoDom() {
    
    
				const video = uni.createSelectorQuery().in(this);
				video.select('#video').boundingClientRect(video => {
    
    
					var video = video
					// console.log(video)
				}).exec();
				var ctx = uni.createCanvasContext('output_mini', this);
				console.log(ctx);
},

You can get the node information of dom:

insert image description here

Guess you like

Origin blog.csdn.net/qq_58648235/article/details/127149309