Der obige Code nimmt den Wert aus dem Textfeld und erstellt die Anzahl der Schaltflächen, die dem im Textfeld eingegebenen Wert entsprechen. Jetzt wird ein neuer Wert in Text I eingegeben wollte vor dem Erstellen neuer Schaltflächen die zuvor erstellte Schaltfläche löschen.Wie kann dies erreicht werden?So entfernen Sie ein zuvor erstelltes Element, bevor Sie einen neuen Satz von Elementen hinzufügen
Weisen Sie den neu zu erstellenden Elementen einen Klassennamen zu.
x.setAttribute("class", "some-class-name");
Dann entfernen Sie alle Elemente vonClass, bevor Sie die neuen hinzufügen.
Erstellen Sie einfach ein Element, d. H. Ein div und löschen Sie es, bevor Sie neue Elemente hinzufügen. Etwas wie:
<html>
<body>
<div id="result"></div>
<input type="text" id="number"/>
<input type="button" value="create button" onclick="createbtn()"/>
<br>
<script>
function createbtn(){
var n=document.getElementById("number").value;
document.getElementById("result").innerHTML = "";
for(i=1;i<=n;i++){
var x = document.createElement("INPUT");
x.setAttribute("type", "button");
x.setAttribute("value", i);
x.setAttribute("id","x"+i);
document.getElementById("result").appendChild(x);
}
}
</script>
eine Schaltfläche Containerelement hinzufügen, und fügen Sie alle Tasten zu diesem Container. Löschen Sie den Inhalt, bevor Sie neue hinzufügen.
Erstellen Sie einen Container, in dem Sie die Schaltflächen platzieren können. Löschen Sie den Container zu Beginn Ihrer Funktion.
<input type="text" id="number"/>
<input type="button" value="create button" onclick="createbtn()"/>
<div class="buttons"></div>
<script>
function createbtn()
{
var buttons_container = document.getElementsByClassName("buttons")[0];
var n=document.getElementById("number").value;
buttons_container.innerHTML = '';
for(i=1;i<=n;i++)
{
var x = document.createElement("INPUT");
x.setAttribute("type", "button");
x.setAttribute("value", i);
x.setAttribute("id","x"+i);
buttons_container.appendChild(x);
}
}
</script>