# 3.3 符號

## 星號

**`$("*")`**：所有標籤。

## 逗號

**`$("h1, p")`**：標籤名稱為 h1 或 p 的元素。

## 空格

**`$("div p")`**：div 標籤裡面的所有 p 元素(不管是第一層子元素或更內層)。

## 大於符號

**`$("div > p")`**：div 標籤裡面的第一層子元素為 p 標籤的元素。

## 加號

**`$("p + p")`**：先找到 p 標籤，然後同層的下一個是 p 標籤的元素(例如以下的「段落2」符合)。

例：

```markup
<p>段落1</p>
<p>段落2(這個符合)</p>
<div>
  <p>段落3</p>
</div>
<p>段落4</p>
```

## 波浪符號

**`$("div ~ p")`**：先找到 div 標籤，然後同層後面所有的 p 標籤的元素。(例如以下的段落2、段落3都符合)

```markup
<p>段落1</p>

<div></div>

<p>段落2(符合)</p>
<p>段落3(符合)</p>
```

## 練習

延續 `practice/selectors.html` 頁面，更改內容為：

```markup
<h1>這是標題</h1>
<h1 id="my_title">這是我的標題</h1>
<p>這是段落1</p>
<p class="para para2">這是段落2</p>
<p class="para para3">段是段落3</p>

<hr>
<p class="para para4">段是段落4</p>

<div>
  <a href="#" target="_blank">這是連結</a>
  <p>div 裡的段落</p>
  <section>
    <p>div 裡更內層的段落</p>
  </section>
  <p>div 裡的段落</p>
</div>

<p>其它段落1</p>
<p>其它段落2</p>
```

試以下例子：

```javascript
$("*").css("color", "red");
```

```javascript
$("h1, p").css("color", "red");
```

```javascript
$("div p").css("color", "red");
```

```javascript
$("div > p").css("color", "red");
```

```javascript
$("p + p").css("color", "red");
```

```javascript
$("div ~ p").css("color", "red");
```


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.webmix.cc/jquery/3.-xuan-ze-zi-selectors/3.3-jin-jie-xuan-ze-zi.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.