divにクラスを追加

Question

動的入力を作成するときにdivにクラスを追加する方法。

div.class = "form-group"; 

私のために働いていません。これは蛇のコードでコメントされています。

<script type="text/javascript"> 
    function dynInput(cbox) { 
     if (cbox.checked) { 
      var input = document.createElement("input"); 
      input.type = "text"; 
      var div = document.createElement("div"); 
      div.id = cbox.value; 
      //div.class = "form-group"; 
      div.innerHTML = "<label>Cost Per Test For " + cbox.value + "</label>"; 
      div.appendChild(input); 
      document.getElementById("insertinputs").appendChild(div); 
     } else { 
      document.getElementById(cbox.value).remove(); 
     } 
    } 
</script> 

Answer 1

これに変更する必要があります：

div.className = "form-group"; 

Answer 2

それは、classNameの代わりclassする必要があります：

div.className = "form-group"; 

あなたが代わりにclassList()を使用することができます。 CLASSLISTを使用して

はelement.className経由スペース区切りの文字列としてクラスの要素のリストにアクセスする便利な代替手段です。

div.classList.add('form-group'); 

は、この情報がお役に立てば幸いです。

Answer 3

使用jqueryのaddClass()

$(div).addClass('form-group'); 

や文字列などの要素を作成し、jqueryのappend()使用してそれらを追加します。

<script type="text/javascript"> 
    function dynInput(cbox) { 
     if (cbox.checked) { 
      label = "<label>Cost Per Test For " + cbox.value + "</label>"; 
      $("#insertinputs").append('<div class="form-group" id="'+cbox.value+'">'+label+'<input type="text"></div>'); 
     } else { 
      $('#'+cbox.value).remove(); 
     } 
    } 
</script> 

Answer 4

div.classNameだけでなく.class