无法使用Javascript更改输入标签的属性

Question

I have an <input> tag which I would like to change programmatically. The input don't have inner text, it save its values on aria attributes.

So, here is the <input> :

<input type="text" id="foo" aria-valuemin="1" aria-valuemax="10" autocomplete="off" role="spinbutton" aria-valuenow="1">

Consider that we save the tag to the following bla variable:

var bla = document.getElementById("foo");

Below is a list of commands I tried using. But none of them worked.

• bla.value = 2;
• bla.value = "2";
• bla.setAttribute("aria-valuenow",2);
• bla.setAttribute("aria-valuenow","2");

Any ideas why? The id of the element is unique, I checked it. I am working on somebody's else code. Could it be possible that other developers changed the behavior of the <input> ?

Answer 1

As pointed out my other users, please use unique Id while naming the id of an element. Below is the solution to your problem using setAttribue() .

 var input = document.getElementById("input"); input.setAttribute("aria-valuenow",2); // To set attribute to input element console.log(input.hasAttribute('aria-valuenow')) // To check if input has the mentioned attribute console.log(input.getAttribute('aria-valuenow')); // To access the value of the attribute 

 <input type="text" id="input" aria-valuemin="1" aria-valuemax="10" autocomplete="off" role="spinbutton" aria-valuenow="2"> 

Answer 2

您可以使用，

document.getElementById("mytext").value = "My value";