> For the complete documentation index, see [llms.txt](https://chanshiyu.gitbook.io/blog/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://chanshiyu.gitbook.io/blog/zhi-han/2023-01-10.md).

# 2023-01-10

### 01 触发自定义事件

```javascript
window.addEventListener('resize', function () {
  console.log('当前页面缩放比例应该是：' + Math.round(1000 * (outerWidth / innerWidth)) / 10 + '%')
})
window.dispatchEvent(new CustomEvent('resize'))
```

### 02 判断奇偶

```javascript
n & 1 // 和 n % 2 结果一致，偶数返回 0，奇数返回 1
```

### 03 substr 与 substring 的区别

定义：

* substr(start,length) 第一个字符的索引是 0，start 必选，length 可选
* substring(start,end) 第一个字符的索引是 0，start 必选，end 可选

异同：

* 相同点：当有一个参数时，两者的功能是一样的，返回从 start 指定的位置直到字符串结束的子串
* 不同点：有两个参数时，
  * substr(start,length) 返回从 start 位置开始 length 长度的子串
  * substring(start,end) 返回从 start 位置开始到 end 位置的子串（不包含 end）

### 04 [模拟微信对话的对称布局](https://demo.cssworld.cn/new/3/2-3.php)

```html
<section class="msg-item">
  <img class="msg-avator" alt="武元润香" src="../images/bg-1.jpg" />
  <div class="msg-info">
    <span class="msg-user">武元润香</span>
    <div class="msg-txt">
      <p>没问题哟~</p>
    </div>
  </div>
</section>
<section class="msg-item" data-self>
  <img class="msg-avator" alt="唯我成幸" src="../images/bg-2.jpg" />
  <div class="msg-info">
    <span class="msg-user">唯我成幸</span>
    <div class="msg-txt">
      <p>大家有什么想要了解的吗？</p>
    </div>
  </div>
</section>
```

```css
/* 设置direction:rtl，则水平文档流方向就是从右往左 */
.msg-item[data-self] {
  direction: rtl;
}
```

### 05 事件对象 currentTarget 属性

* event.target 表示点击的元素
* event.currentTarget 表示绑定事件的元素


---

# Agent Instructions
This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com.

## 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://chanshiyu.gitbook.io/blog/zhi-han/2023-01-10.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.