为什么在将`maxlength`属性设置为`input`时不能使用点符号？

Question

我正在使用Firefox，我想将动态创建的input添加到文档中。我使用点符号来设置属性。

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

然而，我遇到了一个奇怪的问题 正确添加了placeholder属性，但未设置maxlength。

我做了一个JSFiddle来证明它：https://jsfiddle.net/phc8fxba/

我找到的唯一解决方法是使用.setAttribute(maxlength, 4)，但这很奇怪。

为什么点符号在这里不起作用？

Answer 1

你有一个错字，它应该是：

input.maxLength = 4;

Answer 2

该属性的名称为maxLength，而不是maxlength：

input.maxLength = 4;

HTML属性不是区分大小写的，但JavaScript属性是。

Answer 3

使用input.maxLength = 4;进行更改。您的命令不起作用，因为javascript支持camel case。

Answer 4

您需要使用setAttribute函数来设置maxlength和占位符等。点符号直接访问属性。使用getter或setter函数会更好。

var input = document.createElement("input");
input.setAttribute('placeholder', 'Working');
input.setAttribute('maxLength', 4);