Javascript

Question

context: I am doing something like an OS in HTML with css and javascript. inside the code I have a js dictionary with the code of each "app" and when you press the button of one of the javascript apps it makes a "document.getElementById ('div'). innerHTML + = (app data)" but when opening any app and write something in a textArea or input and then open another "app" what was written in the textarea is deleted (see the code: example) also all addEventListener are removed. the question is is there another way to do the same as an innerHTML but with something similar to createTextNode (see code "createTextNode(sololearn)")
https://code.sololearn.com/W5hhdnevnteh/?ref=app
https://code.sololearn.com/Ws7y8HJBFApg/?ref=app

Answer 1

Html

<button id="btn" onclick="addTextArea()">Click</button>
<div id="demo"></div>

JS

let div = document.getElementById("demo");
let c=0;

addTextArea = () => {
let ta = document.createElement("textarea");
ta.style.color = "red";
ta.innerText = "TextArea No:" + ++c;
div.appendChild(ta);
}

// I hope this link helps you

https://code.sololearn.com/Ws0AB6J49sXO

Answer 2

Simon Sauter Yes, it's just to do something similar, just the visual part and it works
https://code.sololearn.com/WDGQqJ83817M/?ref=app

Answer 3

SoloProg can this be done?
https://code.sololearn.com/W5hhdnevnteh/?ref=app

Answer 4

Are you sure you understand what an OS is?

Answer 5

HTML DOM removeEventListener() Method

https://www.w3schools.com/jsref/met_element_removeeventlistener.asp