getElementById没有按预期工作？

Question

我有这个simple html标记：

<form id="form" action="lalala">
  <input type="text" id="action"/>  //a reserved property name id
  <input type="submit" id="submit"/> //same here
</form>

然而 - 跑步：

alert(document.getElementById('form').action);

警报

而不是“lalala”就像它应该的那样。

似乎getElementById的道具不能直接访问

为什么？ .....它实际上意味着我必须知道所有表单元素的道具（为了不向后代元素提供保留的prop ID）？

Answer 1

尝试这样：

alert(document.getElementById('form').getAttribute("action"));

Answer 2

这与getElementById无关，而与HTML表单元素对象的属性有关。

  

保留的属性名称id

它不是“保留”，它只是默认定义的值

如果表单中有表单控件，并且该控件的id（或名称）与表单元素具有的属性匹配，则对该表单控件的引用将覆盖该属性的正常值。

  

当为索引属性检索索引表单元素时，当使用给定索引作为参数调用时，用户代理必须返回元素集合上item方法返回的值。

- http://www.w3.org/TR/html5/forms.html#the-form-element

这很糟糕，但是由于存在这样的事情，表单的DOM是如何工作的。

由于该特定属性映射到属性值，因此您可以使用getAttribute和setAttribute来操纵它。 （这不适用于旧的IE（对于那些对属性进行操作的方法执行方式有所破坏），并且不适用于其他一些属性（如submit方法）。）

  

它实际上意味着我必须知道所有表单元素的道具（为了不向后代元素提供保留的prop ID）

是

Answer 3

您可以通过以下属性访问它：

document.getElementById('form').attributes["action"].value

Answer 4

你不能在这种情况下编写.action，因为你应该访问它，抛出它的属性而不是属性，这是一个属性，因此，你需要getAttribute而它会工作：）

alert(document.getElementById('form').getAttribute("action"));