复选框不会追加

Question

所以HTML有这些元素，可以有一个随机数。我只想创建一个复选框，并将其添加到名称为 class "username" 的每个元素中。

因此，当创建具有 class "username" 的新元素或打开页面时。它将为其添加一个复选框。

这是我的脚本。

var chec = document.createElement("div");     //Creates the div..
chec.innerHTML = '<input type="checkbox" value="test">'; //Create checkbox

var addc = document.querySelector("span[class='username']") // username Element.

var i;
for (i = 0; i < addc.length; i++) {
chec += addc[i];
}

它不添加复选框。谁能帮助我理解原因并可能帮助我编写脚本。

Answer 1

var addc = document.querySelectorAll("span.username") // Get all elements with class "username"

for (var i = 0; i < addc.length; i++) {
  var div = document.createElement("div");
  var check = document.createElement("input");
  check.type = "checkbox";
  check.value = "test";
  div.appendChild(check);
  addc[i].appendChild(div);
}

<span class="username"></span>

<span class="username"></span>

<span class="username"></span>

复选框不会追加

Check box won't append

javascript

tampermonkey