# 练习 11：input 实时预览

## 目标

学会处理输入类事件，让页面随着用户输入实时变化。

## 你要练什么

- `input` 事件
- `change` 事件
- 表单值读取
- 实时 DOM 更新

## 任务

- 在输入框输入昵称时，实时更新预览标题
- 在文本域输入学习目标时，实时更新预览内容
- 切换学习阶段下拉框时，更新阶段标签

## 文件

- [starter.html](/Users/lijiaqing/home/wwwroot/front-end-example/04-dom-events-async/11-input-live-preview/starter.html)
- [starter.js](/Users/lijiaqing/home/wwwroot/front-end-example/04-dom-events-async/11-input-live-preview/starter.js)
- [answer.html](/Users/lijiaqing/home/wwwroot/front-end-example/04-dom-events-async/11-input-live-preview/answer.html)
- [answer.js](/Users/lijiaqing/home/wwwroot/front-end-example/04-dom-events-async/11-input-live-preview/answer.js)