Javascript：更改div中第一個元素的類

Question

我正在嘗試更改第一個div的類。 例如

var div1 = element.getElementsByClassName("parent") 
 
div1.children[0].setAttribute("class", "1 2");

<div class="parent"> 
 
    <div class="1">Test</div> 
 
    <div class="1">test</div> 
 
    <div class="1">test</div> 
 
</div>

但類並沒有改變。任何想法爲什麼？ 謝謝:)

Answer 1

將其更改爲：

div1.children[0].className = "1 2"; 

或者

div1.children[0].classList.add('1'); 
div1.children[0].classList.add('2'); 

你應該順便說一句挑選更好的類名！

編輯：

var div1 = document.getElementsByClassName("parent")[0]; 
div1.children[0].classList.add('1'); 
div1.children[0].classList.add('2'); 

Answer 2

jQuery的方式：

$(".parent > div:first").addClass("1 2"); 

Answer 3

// getElementsByClassName return an array (it is a collection) 
 
var allDivs = document.getElementsByClassName("root"); 
 

 
// in the array i need the first 
 
var myFirstElement = allDivs[0]; 
 

 
// i want first child 
 
var myFirstChild = myFirstElement.children[0]; 
 

 
myFirstChild.className = 'b' ;

.a{ border : solid 1px red } 
 
.b{ border : solid 1px blue }

<div class="root"> 
 
    <div class="a">Test</div> 
 
    <div class="a">test</div> 
 
    <div class="a">test</div> 
 
</div>