javascript - 可以使用 Javascript 中的点表示法访问元素属性吗？

Question

我正在编写一个动态创建一组按钮的脚本，所有这些按钮都是使用类属性创建的，以便我可以设置它们的样式。但样式从来没有奏效。

我添加了类值，如下所示:button.class = "foo";哪里button是对 <button> 的引用DOM 中的元素。

我将上面的代码更改为 button.setAttribute("class", "foo");它有效!

但这让我很困惑，因为我使用点符号(或对象属性符号？我不知道该怎么调用它)来设置其他值，例如属性 value .

例如，我在某些按钮上有一个事件监听器。单击它们后，value属性被添加到元素中。当再次单击时，它会被删除:

button.onclick = function() {
  if (this.value)
    this.removeAttribute("value");
  else
    this.value = "bar";
}

以上内容按预期工作。

所以我的问题是 - 为什么像 button.class = "foo"; 这样的符号似乎适用于某些属性而不适用于其他属性？有没有办法找到哪些属性将使用该表示法适本地表现？

Answer 1

您需要使用className property 来获取和设置指定元素的 class 属性的值。

The name classNameis used for this property instead of class because of conflicts with the "class" keyword in many languages which are used to manipulate the DOM.

button.className= "foo"