Javascript 动态按钮id

Question

我已经使用 Javascript 动态制作了一个按钮，现在我需要给那个按钮一个 ID，我已经尝试过

buttonElementBlokkeer.setAttribute("id", "buttonBlokkeer");

& 

buttonElementBlokkeer.id = "buttonBlokkeer"

两者都不起作用。 这些按钮嵌套在一个已经有 id 的部分中，这可能是它不起作用的原因吗？

Answer 1

HTML

<div id="divId"></div>

JS

for (i = 1; i <= 3; i++) {
    var btn = document.createElement("BUTTON");// create       button using java script
    btn.className = "btnsize";
    btn.id = "btnid"+ i;
    var txt = document.createTextNode("Buttons"+i);//creat text on button
    btn.appendChild(txt);//attached text on button
    document.getElementById("divId").appendChild(btn);//atache button with text in div 
}

Answer 2

尝试这个：

let button = document.createElement('input');
button.setAttribute('type', 'BUTTON');
button.setAttribute('ID', 'buttonBlokkeer');
button.setAttribute('value', 'BUTTON');
button.setAttribute('onclick', 'test()');
document.body.appendChild(button);


function test() {
  console.log("BUTTON !");
  alert("BUTTON !");
}

https://jsfiddle.net/onw2esyg/

Answer 3

这对我有用。 如果您想通过 class 名称访问，可以使用 getElementsByClassName() function。

<button id="changeId">Button1</button>
<button onclick="update()">Update</button>
    
<script>
function update() {
   document.getElementById("changeId").id = "IdUpdated";
}
</script>