How to load a page with already executed js?

Question

JavaScript

I'm making an extension for google chome, it adds pictures to certain elements on the site I need using jquery. But when I load the desired page, I don't see the result of the script right away, it works with a delay, how can I fix this?

Answer 1

Google Chrome extensions have 2 types of scripts: background and let's call them foreground (I don't remember exactly what they are called in the documentation).
Background work when the extension is running, and foreground when a certain page is loaded, which you registered in manifest.json
These foreground scripts are loaded when the entire page has loaded. If something still blocks the page, then this creates a problem for you.
Look into background scripts, but Chrome's performance will suffer a bit as you have to constantly check which page has been loaded.

Answer 2

Faced with it. I solved this problem like this:
1) I found a script after which I need to execute my own
2) Through innerHTML, I changed the name of the function (but not the call to this function) from, for example, foo () to foozzz ()
3) In my extension, I created the foo () function exactly with the same code, but at the end I added my own code or a call to my function (in your case there will be a code for adding elements)
4) Injected my foo () function into the head of the page.
As a result, when the page loads, the server function code will be replaced with yours, exactly the same, but in addition with its own code. The function call will be as it should be, after some necessary seconds, so your code will work when it needs to.