---
name: "createSelectorQuery"
mode: "api"
versionRequirements:
  - { name: "Base Library", version: "2.10.0" }
title: "ty.createSelectorQuery - Create and return a SelectorQuery object instance"
---

## createSelectorQuery

> [VERSION] Base Library >= 2.10.0

### Description

Returns a SelectorQuery instance. Use methods like select to choose nodes, and methods like boundingClientRect to retrieve node information.

### Parameters

None


### Return Value

Type: `SelectorQuery`

[SelectorQuery Object](/en/miniapp/develop/miniapp/api/tyml/SelectorQuery/SelectorQuery)

##### SelectorQuery

| Property | Type | Since | Description |
| --- | --- | --- | --- |
| `select` | `(selector: string) => NodesRef` | `2.10.0` | Selects the first node on the current page that matches the selector. Returns a NodesRef instance that can be used to get node information |
| `selectAll` | `(selector: string) => NodesRef` | `2.10.0` | Select all nodes matching the selector on the current page and return a NodesRef instance |
| `selectViewport` | `() => NodesRef` | `2.10.0` | Select the viewport; can be used to obtain the viewport's size, scroll position, and other information |
| `exec` | `(execCallback: unknown) => void` | `2.10.0` | Execute all queued requests. The results are assembled into an array in request order and returned as the first argument of the callback |

### Examples

#### Create a selector query to get node info

```html
// index.tyml
<view id="my-id" class="box">Target node</view>
<button bind:tap="getRect">Get node info</button>
```

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

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