html - 在 JavaScript 中设置动态创建元素的 `class` 属性

Question

我有一个自定义元素，创建方式如下:

connectedCallback()
{
  var on_off_switch = document.createElement('Div');
  on_off_switch.class = 'switch demo3';

  this.appendChild(on_off_switch);

 }

但是我在查看源代码时注意到 on_off_switch 的类没有设置为 switch demo3。

所有其他分配都有效，例如 on_off_switch.style['background-color'] = 'red' 等。

是否可以设置附加在自定义元素内的元素的 CSS class？

Answer 1

对于 historical reasons , className使用属性代替 class:

function connectedCallback () {
  var on_off_switch = document.createElement('div')
  on_off_switch.className = 'switch demo3'

  this.appendChild(on_off_switch)
}