2

I will admit it. I don't understand closures. No matter how many videos I watch, or which explanations I read, they are over my head. Pretty embarrassing, since I saw that about 14,000 people were jumping for joy after reading the explanations here:

How do JavaScript closures work?

But in spite of my ignorance, I think that I might need closures to solve my problem. Here it is: I have set up a couple of <div> Tags for the express purpose of giving me something that I can clone in a JavaScript routine. Here is my <div> structure. It is pure perfection.

<div id="Anchor-Div-01">

<div id="Display-Div-02">

<p>This is a Test</p>

</div>

</div>

I have created several HTML buttons that will cause various JavaScript routines to intentionally mess-up either the paragraph, or the "Display-Div-02" Tag, and I want to be able to put them back in their original form. To that end, when the Web-Page was initially loaded, I used the two equations below to Clone the original "Display-Div-02" Node which was then saved in the "Div_Clone_02" variable ( as shown below. )

var Temp_Anchor_1 = document.querySelector("#Anchor-Div-01");  

var Div_Clone_02 = Temp_Anchor_1.children[0].cloneNode(true);

I have also placed a "Reset" Button on the page that will remove the messed-up Node, and then copy the "Div_Clone_02" Node into the blank space, to bring everything back to its initial state of perfection.

Unfortunately, my "Div_Clone_02" variable depends on the current ( messed-up ) state of the "id=Display-Div-02" <div> and the <p> Tag, because both of those HTML Tags are hiding inside of children[0] above. So my "Div_Clone_02" node is no longer a Clone of the Original <div>; the Cloned Node is precisely as messed-up as the Display-Div-02 is.

I'm not so stupid as to go back to those two equations and re-calculate the value of the "Div_Clone_02" Node ( while the "Display-Div-02" Tag is in its messed-up state. ) Obviously that would be a mistake. But the browser is surreptitiously re-calculating the Clone behind my back, without me ever asking him to do that.

Can anyone tell me how I can record the initial value of my Clone variable ( "Div_Clone_02" above ), and then save that initial state in a ( dare I say it ? ) a Safe-Space ... where it won't get destroyed by all of the rogue JavaScript routines that are trying to mess-up my perfect Web-Page?

Crusty
  • 66
  • 5

1 Answers1

0

If I am not mistaken I don't think you'll need closures in this case. First things first. A closure is basically a function that is inside another function. Example :

function foo(){
let array = [1,2,3];
  function printArray(){
  console.log(array);
}
printArray();
}

This way the inner function will now have access to the variables inside the outer function.That is why you can do console.log(array) because now you have access to it So now that's cleared up (I hope), to store the initial value you could use localStorage. Just do a google search or watch a youtube video on it and you'll be fine

Winston Brown
  • 97
  • 1
  • 5
  • Thank you for your kind suggestion, but unfortunately, I don't think the Local Storage method is going to work ... although not for the reason that you might think. – Crusty Dec 26 '20 at 11:13
  • Your plan ( I assume ) was that I should take the Cloned Node, run it through JSON stringify, and then store it for safe keeping. But let's skip the storage step. Just as a test, let's convert the Cloned Node using 'stringify' and then IMMEDIATELY convert it back into a JavaScript Object using JSON 'parser'. Now, we can prune out the "Display-Div-02" Node, and graft-in the JSON double-re-heated version. It crashes and burns, but it has nothing to do with Local Storage. The problem is that the JSON translation software is apparently not internally consistent. – Crusty Dec 26 '20 at 11:39
  • But just for the sake of completeness, let's acknowledge that the "Local Storage" people don't make any warranty about saving an exact copy of your data. The storage is free, but they will mangle a beautiful JSON string by adding-in double quotation marks anyplace and everyplace they see fit, and if you don't like it, you will get all of your money back. But good luck trying to get your data back. It's been put through the Local Storage meat grinder. – Crusty Dec 26 '20 at 12:11
  • Oh sorry , I thought you just wanted to store a something's value ,which will be modified, so it can be retrieved – Winston Brown Dec 27 '20 at 20:45