0

I'm developing a Chrome extension that modifies a page's DOM to add extra functionality on page load. After the page loads and I'm done manipulating the DOM, one of the functions that is available to the user is a button that reads all of the text on the page and manipulates it.

My issue is that when I try to iterate through the DOM, there's a lot of objects and text that was added by my extension on page load. I only want this function to iterate through the DOM as it was originally.

Is it possible to save the state of the DOM on page load to use later on?

jkupczak
  • 2,891
  • 8
  • 33
  • 55
  • I'm not sure if this is applicable (maybe?): look up the Shadow DOM, see if that helps at all. –  Dec 02 '16 at 21:25
  • I suppose you could do a `document.body.innerHTML` and save it to localstorage? – mhodges Dec 02 '16 at 21:26
  • 1
    I think it will be much better to add some attribute/class to the elements your extension adds to the page, and later when you go over the DOM elements that exists in the page, just skip the elements you know you added. – Dekel Dec 02 '16 at 21:26
  • Adding up to the previous comment by @ mhodges... https://developer.chrome.com/extensions/storage – Filipe Silva Dec 02 '16 at 21:26
  • there are dom diff tools. or you can make sure your mods have a smoking gun – dandavis Dec 02 '16 at 22:09
  • I think my last question is my answer to this question: http://stackoverflow.com/q/40917938/556079 On page load I can add the DOM to an iFrame and then read it back later. I don't know if I'll run into any performance issues, but it works. – jkupczak Dec 02 '16 at 22:43

0 Answers0