3

Is it possible to modify the DOM during or before the initial DOM parsing? Or do I have to wait until the DOM is parsed and built before interacting with it? More specifically, is it possible to hinder a script element in DOM from running using userscripts/content scripts or similar in chrome or firefox?

Tried using eventListeners on DOMNodeInserted before the DOM is parsed, but these are only fired after the DOM is built.

000
  • 26,951
  • 10
  • 71
  • 101
AMO
  • 676
  • 1
  • 7
  • 13
  • It seems I was not quite clear: The given site/HTML is not mine, so I can't modify the original HTML. I'm creating an extension in chrome where I'm displaying a site, but trying to hinder the effects of certain scripts in the original site by injecting javascript before the DOM is parsed. – AMO Apr 04 '10 at 20:20

4 Answers4

1

These are two separate questions:

1. Is it possible to modify the DOM during or before the initial DOM parsing?

Yes. As soon as the browser builds the root element, then you can start querying and mutating the DOM. Note that when your script runs, some of the page may still yet be unparsed, perhaps even still in transit on the network. Your script generally has access to any element declared in the source before the script tag containing/calling your script. This includes parent elements containing your script tag.

2. Is it possible to hinder a script element in DOM from running using userscripts/content scripts or similar in chrome or firefox?

No. All scripts are executed and one script can't prevent another script's initial execution. However, you can perhaps go back through and remove event handlers, and otherwise attempt to counteract the effects of a script. Although this scenario seems a bit shady and/or against the grain of normal JavaScript usage.

greim
  • 9,149
  • 6
  • 34
  • 35
  • You're right, that was actually two separate questions. Following up on the first, what I was interested in was if there is any eventlisteners or similar that will interrupt the the initial parsing and allow me to modify the DOM before the parsing is finished. The given here is that the original site/DOM is not mine, so I can't insert a script directly into the site, only inject it before the parsing with userscripts/content scripts. – AMO Apr 05 '10 at 10:29
  • Ah. DOMNodeInserted and DOMNodeInsertedIntoDocument would have been your best bet, but it's not surprising they don't fire until after initial DOM completion. You basically want SAX-style programming access at the browser's HTML parser level, which isn't something browsers expose to web pages. I don't know whether this sort of thing is exposed at the add-on level. Best bet might to be a server side proxy service that strips out scripts you don't like. – greim Apr 05 '10 at 18:54
0

I've actually looked into this a lot while developing an adblocker for Chrome. Basically, you can't use just Javascript to stop Javascript, especially since it would run simultaneously with the script element in question. So even if it would work it would cause a race condition.

Arda Xi
  • 2,616
  • 3
  • 19
  • 24
  • Sorry, don't know too much about javascript execution, but isn't there a formal order in which scripts are executed? – AMO Apr 04 '10 at 20:24
  • That would probably depend on the Javascript engine in question. There's always a risk for a race condition though. Especially in Chrome I've noticed the page is loaded before extensions are executed. – Arda Xi Apr 04 '10 at 21:41
0

you can modify elements during document parsing, but after than this element has added to dom. for example

<div id="example"></div>
<script>
    document.getElementById('example').innerHTML = 'hello';
</script>
<div>something else</div>
  • The site is not mine, so I can't insert a script into the html like this, see my comment to the original question. – AMO Apr 04 '10 at 20:22
0

Is it possible to modify the DOM during or before the initial DOM parsing?

Yes it is possible.

Start by completely preventing the document from getting parsed altogether then on the side, fetch the same document, do any processing on this document and then inject the resulting document in the page.

Here is how I currently do just that https://stackoverflow.com/a/36097573/6085033

Community
  • 1
  • 1