输入值将保存在哪里?

输入的值是其内部状态。它可能等于或不等于输入元素的value属性。

控制值是其内部状态。因此,它可能与用户当前的输入不匹配。

例如,如果用户在一个需要数字的数字字段中输入“3”,则用户输入的将是字符串“3”,但控件值将保持不变。或者,如果用户在电子邮件字段中输入电子邮件地址“awesome@example.com”(带前导空格),则用户输入的是字符串“awesome@example.com”,但电子邮件字段的浏览器用户界面可能会将其转换为值“awesome@example.com”(不带前导空格)。

_{https://www.w3.org/TR/html51/sec-forms.html#forms-value}

而输入上的“value”属性仅表示其默认值:

value content属性提供输入元素的默认值。当添加、设置或删除value content属性时,如果controls dirty value标志为false,则用户代理必须将元素的值设置为value content属性的值(如果有),否则为空字符串,然后运行 current value sanitization algorithm

_{https://www.w3.org/TR/html51/sec-forms.html#element-attrdef-input-value}

请记住,即使用户在输入中输入任何文本,它也不会更新输入的值属性。尝试在下面的输入片段中键入文本,并注意value属性没有更新:

setInterval(function() {
  console.clear();
  console.log("Attribute: ", $("input").attr("value"));
  console.log("Value: ", $("input").val());
}, 1000);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<input value="default">

存储在DOM元素对象的属性中。默认情况下,如果您写:

<input id="input_id" type="tel" required="" pattern="^\d{10}$"> 

那就好像

<input id="input_id" type="tel" required="" pattern="^\d{10}$" value="">

如果你写一些有价值的东西 value="123" 然后值和默认值属性相应地更改。