SetAttribute() не работает так, как я ожидаю, что это

Question

этой строки коды:

document.getElementById('01').getElementsByTagName("input")[0].setAttribute("value", "1"); 

работает прекрасно, когда «ввод» уже не имеет значения. но когда вход уже имеет значение, он не изменит значение. почему это?

Answer 1

Похоже, вы столкнулись путающая разница между свойством элемента value и атрибутом value. Это не то же самое вещи.

Дело в том, что атрибут value служит для значения по умолчанию, поэтому, если элемент уже имеет значение свойства, тогда изменение атрибута value не будет отражено в пользовательском интерфейсе.

Документация говорит this:

Использование SetAttribute(), чтобы изменить некоторые атрибуты, наиболее заметные значения в XUL, работает непоследовательно, так как атрибут определяет значение по умолчанию. Чтобы получить доступ или изменить текущие значения, вы должны использовать свойства. Например, используйте elt.value вместо elt.setAttribute ('value', val).

Так, чтобы продемонстрировать эту ситуацию считают эту небольшую демо:

document.getElementById("01").getElementsByTagName("input")[0].value = 'property set'; 
 

 
document.getElementById("01").getElementsByTagName("input")[0].setAttribute("value", "two");

<div id="01"> 
 
    <input type="text" /> 
 
</div>

В приведенном выше фрагменте кода атрибут значение действительно обновляется дорожить two, и вы можете проверить это, если вы попробуете чтобы прочитать его обратно с getAttribute('value'), однако свойство value имеет приоритет над атрибутом, поэтому позже не отображается.

Answer 2

То, что JavaScript абсолютно меняет значение тега <input>, когда тег уже имеет атрибут value. Смотрите сами здесь: http://jsfiddle.net/qg7d4m32/

Answer 3

для поля ввода, если вы хотите, чтобы установить значение только потребительная стоимость

Чистый JavaScript:

document.getElementById('01').getElementsByTagName("input")[0].value = "value" 

JQuery:

$("input").val("value")