Why does updating a variable containing `document.getElementById("text").value` not change the DOM?

Question

Here is my code, I want remove the <textarea>’s value.

<textarea name="text" id="text" cols="50" rows="6" placeholder="inset" required></textarea>
<input type="button" id="btn" value="등록">
<input type="button" id="btn1" value="추가">

JS:

document.querySelector("#btn").addEventListener("click", function(e) {
  var date = document.querySelector("#date");
  var item = document.querySelector("#item");
  var sn = document.createElement("div");
  var sp = document.createElement("div");
  var txt = document.getElementById("text").value;
  date.appendChild(sn);
  item.appendChild(sp);
  date.removeAttribute("id");
  item.removeAttribute("id");
  sn.setAttribute("id", "date");
  sp.setAttribute("id", "item");
  sn.append(today);
  sp.append(txt);
  txt = "";
});

When I write the code like above I can’t remove the value but in the one below it is working. Why is that?

var date = document.querySelector("#date");
  var item = document.querySelector("#item");
  var sn = document.createElement("div");
  var sp = document.createElement("div");
  var txt = document.getElementById("text").value;
  date.appendChild(sn);
  item.appendChild(sp);
  date.removeAttribute("id");
  item.removeAttribute("id");
  sn.setAttribute("id", "date");
  sp.setAttribute("id", "item");
  sn.append(today);
  sp.append(txt);
  document.getElementById("text").value = "";
});

to remove the text of (id `text`) textarea `document.getElementById('text').value = ""`; — Azad, Oct 07 '19 at 05:55

score 0 · Answer 1 · answered Oct 07 '19 at 05:55

0

txt = ""; // This changes the value of variable txt as ""

whereas,

document.getElementById("text").value = ""; // sets the value of element with id "text" to "".

answered Oct 07 '19 at 05:55

vS12

310
2
8

Why does updating a variable containing `document.getElementById("text").value` not change the DOM?

1 Answers1