Search code examples
javascripthtmlmaxlength

Why can I not use dot notation while setting `maxlength` attribute to an `input`?

I am using Firefox and I wanted to add dynamically created input to the document. I use the dot notation to set attributes.

var input = document.createElement("input");
input.placeholder = "Working";
input.maxlength = 4;
document.getElementById("add_here").appendChild(input)

However, I encountered a strange issue.
The placeholder attribute is correctly added, but the maxlength is not set.

I made a JSFiddle to prove it: https://jsfiddle.net/phc8fxba/

The only workaround I found is to use .setAttribute(maxlength, 4) but this is weird.

Why is dot notation not working here?

Solution

  • You have a typo, it should be:

    input.maxLength = 4;