設置一個動態創建的元素的`class`屬性在JavaScript

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) 
 
}

Answer 2

class是元件屬性的名稱，而className是其相應的屬性：

on_off_switch.className = 'switch demo3' 
// or  
on_off_switch.setAttribute('class', 'switch demo3')