uniapp获取dom
时间: 2023-08-18 13:09:36 浏览: 189
Android读取DOM文件
在UniApp中获取DOM元素有两种常用的方法:
1. 使用原生的小程序API:可以直接使用`this.createSelectorQuery()`方法来获取DOM元素。例如:
```javascript
// 在组件的methods中
getDomElement() {
uni.createSelectorQuery().select('#myElement').boundingClientRect((rect) => {
console.log(rect)
}).exec()
}
```
其中,`#myElement`是需要获取的DOM元素的选择器,`boundingClientRect`是获取元素的位置信息,你可以根据需要使用其他API来获取更多的属性。
2. 使用Vue的$refs:在组件中给DOM元素添加`ref`属性,然后可以通过组件实例的`$refs`属性来访问DOM元素。例如:
```html
<template>
<view ref="myElement">Hello UniApp</view>
</template>
<script>
export default {
methods: {
getDomElement() {
console.log(this.$refs.myElement)
}
}
}
</script>
```
在上面的例子中,`this.$refs.myElement`就是获取到的DOM元素。
请注意,以上方法针对不同的使用场景,选择合适的方法来获取DOM元素。同时,也要确保DOM元素已经渲染完毕才能正确获取。
阅读全文