localStorage - Object Htmltablerowelement

Asked

Viewed 87 times

0

I am trying to save the html code changes on my page made by an interaction of Java. More precisely I want the table I create with js to keep saved the changes in html.

localStorage.setItem("resposta", document.querySelector("#tabela-anagrama"));

localStorage.getItem("resposta")

When I do a console.log to see what’s saved in localStorage the answer is [Object Htmltablerowelement]

My question is the following how do I save the html code and make when I update the page the table comes back already with the saved changes?

javascript html5

1 answer

0

Use the attribute outerHTML. It will return the code HTML of the element.

localStorage.setItem("resposta", document.querySelector("#tabela-anagrama").outerHTML);

Downside:

This has a downside, in case you want to add too much data, the method setItem will return a Exception due to lack of space.

Here is a table with the available size, per browser, for the Local Storage:

Capacidade detalhada para vários browsers.

  • Depending on the content sometimes the localStoage do not correctly save the content because it seems convert to String, and send as Base64 localStorage.setItem("resposta",btoa(document.querySelector("#tabela-anagrama").outerHTML)); then to recover: atob(localStorage.resposta);?

  • 1

    @Rpgboss The problem that the base64 is almost always bigger than the code itself and also it is a String. I did a test with the table above, and no errors occurred. But I added the disadvantage of the storage limit (I believe it will not have errors cause it).

  • It really makes a lot of sense, so in the end I think it doesn’t even pay to save the HTML content, only the values and content, I don’t know what happens if there are too many line breaks.

Browser other questions tagged javascript html5

You are not signed in. Login or sign up in order to post.