如何修復我的清除按鈕以刪除數組

Question

我真的需要幫助讓我的按鈕的 onclick 清除。 努力理解如何在輸入數組名稱后清除它們。 我最近才在學習 Javascript，而我在 Html 方面的知識也很一般。

 function Add() { //create a para obj var newPara = document.createElement("p"); //create the text content var input = document.getElementById("txtName").value; var newText = document.createTextNode(input); //attach the text to the para obj newPara.appendChild(newText); //attach the para obj to the div obj var myDiv = document.getElementById("result"); myDiv.appendChild(newPara); } function Clear() { var newPara = document.getElementById("tostring") input = "" newPara.value = 0; } function Count() { var arrPara = document.getElementById("result").childNodes; document.getElementById("result").removeChild(arrPara[Index.Count]); }

 <label>Name</label><input id="txtName" type="text" /><br /> <p id="displayNames"></p> <button onclick="Add()">Add</button> <!-- add the name to an array and display the name on the paragraph --> <button onclick="Clear()">Clear</button> <!-- clear the names in the array and clear the paragraph --> <button onclick="Count()">Count</button> <!-- count and display the number of times the name has been entered --> <div id="result"></div>

Answer 1

您可以在add()旁邊清除值。

請注意：您的HTML中沒有任何帶有#tostring元素。

更改：

//create the text content
var input = document.getElementById("txtName").value;
var newText = document.createTextNode(input);

至：

//create the text content
var input = document.getElementById("txtName");
var newText = document.createTextNode(input.value);
input.value = ''; // clear the value

Answer 2

當您單擊按鈕時，它將清除輸入值。

 function Add() { //create a para obj var newPara = document.createElement("p"); //create the text content var input = document.getElementById("txtName").value; var newText = document.createTextNode(input); //attach the text to the para obj newPara.appendChild(newText); //attach the para obj to the div obj var myDiv = document.getElementById("result"); myDiv.appendChild(newPara); document.getElementById('txtName').value = ''; } function Clear() { var newPara = document.getElementById("result") newPara.textContent = ''; console.log(newPara) newPara.value = 0; } function Count() { var arrPara = document.getElementById("result").childNodes; document.getElementById("result").removeChild(arrPara[Index.Count]); }

 <label>Name</label><input id="txtName" type="text" /><br /> <p id="displayNames"></p> <button onclick="Add()">Add</button> <!-- add the name to an array and display the name on the paragraph --> <button onclick="Clear()">Clear</button> <!-- clear the names in the array and clear the paragraph --> <button onclick="Count()">Count</button> <!-- count and display the number of times the name has been entered --> <div id="result"></div>

謝謝！

Answer 3

function Clear() {
 document.getElementById("result").textContent ="";
 document.getElementById("txtName").value ="";
}