在 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's class 未设置为switch demo3。

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

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

Answer 1

由于历史原因，className使用该属性而不是class：

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

  this.appendChild(on_off_switch)
}