📝
Form 大师，用户老是抱怨输入太麻烦，有没有什么办法能给点提示？
🧙♂️
当然有！让我给你介绍一位新朋友——<datalist>！它可是自动补全的小能手。
<datalist> 元素规定输入域的选项列表。当用户在 input 域中输入时，它会提供一个下拉列表供选择。
<form action="/action_page.php">
<label>选择浏览器:</label>
<input list="browsers" name="browser">
<datalist id="browsers">
<option value="Chrome">
<option value="Firefox">
<option value="Safari">
<option value="Edge">
<option value="Opera">
</datalist>
<input type="submit">
</form>
🧮
那如果我想实时显示计算结果呢？比如购物车总价？
🧙♂️
问得好！这时候就需要 <output> 登场了！它专门用来显示脚本计算的结果。
<form oninput="x.value=parseInt(a.value)+parseInt(b.value)">
0
<input type="range" id="a" name="a" value="50">
100 +
<input type="number" id="b" name="b" value="50">
=
<output name="x" for="a b">100</output>
</form>