微信小程序的document.querySelector失效
时间: 2023-07-18 08:48:20 浏览: 86
微信小程序 图片边框解决方法
在微信小程序中,我们可以使用 `wx.createSelectorQuery()` 方法来获取页面中的节点信息。相较于 `document.querySelector()`,它更加适用于小程序的开发环境。
`wx.createSelectorQuery()` 方法返回一个 `SelectorQuery` 对象,我们可以通过它的方法来获取节点信息。例如,如果我们要获取 `id` 为 `myCanvas` 的 `canvas` 元素,可以这样写:
```
wx.createSelectorQuery().select('#myCanvas').node(function(res){
console.log(res.node) // 返回一个canvas节点的对象
}).exec()
```
上面的代码中,`select()` 方法用来指定要获取的节点,传入一个 CSS 选择器字符串。`node()` 方法用来获取节点信息,它的回调函数的参数 `res` 中包含了节点的信息。最后,调用 `exec()` 方法来执行查询操作。
需要注意的是,`wx.createSelectorQuery()` 方法是一个异步方法,所以我们不能直接在它后面使用返回值。而是需要在回调函数中处理查询结果。
另外,如果你想要获取多个节点的信息,可以使用 `selectAll()` 方法来选择多个节点,然后使用 `node()` 方法来获取每个节点的信息。例如:
```
wx.createSelectorQuery().selectAll('.my-class').node(function(res){
console.log(res) // 返回一个数组,包含每个节点的信息
}).exec()
```
上面的代码中,`selectAll()` 方法用来选择多个类名为 `my-class` 的节点,传入一个 CSS 选择器字符串。`node()` 方法用来获取节点信息,它的回调函数的参数 `res` 中包含了一个数组,每个元素是一个节点的信息。
阅读全文