---
name: "createSelectorQuery"
mode: "api"
versionRequirements:
  - { name: "基础库", version: "2.10.0" }
title: "ty.createSelectorQuery - 创建并返回一个 SelectorQuery 对象实例"
---

## createSelectorQuery

> [VERSION] 基础库 >= 2.10.0

### 描述

返回一个 SelectorQuery 对象实例。可以在这个实例上使用 select 等方法选择节点，并使用 boundingClientRect 等方法获取节点信息。

### 参数

无


### 返回值

类型: `SelectorQuery`

[SelectorQuery 对象](/cn/miniapp/develop/miniapp/api/tyml/SelectorQuery/SelectorQuery)

##### SelectorQuery

| 属性 | 类型 | 最低版本 | 描述 |
| --- | --- | --- | --- |
| `select` | `(selector: string) => NodesRef` | `2.10.0` | 在当前页面下选择第一个匹配选择器 selector 的节点。返回一个 NodesRef 对象实例，可以用于获取节点信息 |
| `selectAll` | `(selector: string) => NodesRef` | `2.10.0` | 在当前页面下选择匹配选择器的所有节点，返回 NodesRef 对象实例 |
| `selectViewport` | `() => NodesRef` | `2.10.0` | 选择显示区域，可用于获取显示区域的尺寸、滚动位置等信息 |
| `exec` | `(execCallback: unknown) => void` | `2.10.0` | 执行所有的请求。请求结果按请求次序构成数组，在 callback 的第一个参数中返回 |

### 示例代码

#### 创建查询对象获取节点信息

```html
// index.tyml
<view id="my-id" class="box">目标节点</view>
<button bind:tap="getRect">获取节点信息</button>
```

```js
// index.js
Page({
  getRect() {
    var query = ty.createSelectorQuery();
    query.select('#my-id').boundingClientRect((rect) => {
      console.log('节点信息', rect);
    }).exec();
  },
});
```

```css
// index.tyss
.box {
  width: 300rpx;
  height: 150rpx;
  background-color: #e8f4ff;
  margin-bottom: 20rpx;
}
```
