除非type =“hidden”，否则输入字段值属性不会更改

Question

我想维护一个输入字段来保存一个不需要在前端显示的变量。 所以我创建了一个类似下面的输入。

HTML

<input id="id"  value=""  class="hide-element" />

CSS

.hide-element{
display: none;  }

在javaScript中我通过执行以下操作来更改值。

$('#id').val("Hello");

但是，当我使用 Google Chrome的检查元素时，它会显示value attribute is not changed。

<input id="offSet" value="" class="hide-element">

但是当我删除css并使用如下。

<input id="offSet"  value=""  type="hidden"/>

然后我打电话

$('#offSet').val("Hello");

现在它将显示

<input id="offSet" value="Hello" type="hidden">

在这两种情况下我都可以通过使用下面的方式查看该值 ，但在第一种情况下没有显示。

alert($('#offSet').val());

为什么会出现这种行为？

Answer 1

通常，值属性描述默认值，而不是当前值（您可以通过值访问该值属性（这是val()所做的））。

隐藏的输入不是用户可编辑的，因此您可能会发现它们的默认值和当前值相同。

Answer 2

如果您使用.val（）更改值，则无法在google inspect中查看更改，因为.val（）会在完成操作之前先返回当前值。

如果您使用.attr（value）更改值，则可以在google inspect中查看更改