How detect a specific url in browser and get html page associate in Javascript?

Question

I need to modifiy a html page with javascript (fill a field). I have a specific url but i do not know how to listen when the browser is on the right url and get the html code associate.

I do it with a webextension, so the javascript has to check url in the web browser and get html from here.

Thank you for helping me

Answer 1

When I type firefox extension tutorial into Google, the first hit is this tutorial from MDN. Very close to the top of it is has this code example:

Now create a new file called "manifest.json" directly under the "borderify" directory. Give it the following contents:

{

  "manifest_version": 2,
  "name": "Borderify",
  "version": "1.0",

  "description": "Adds a red border to all webpages matching mozilla.org.",

  "icons": {
    "48": "icons/border-48.png"
  },

  "content_scripts": [
    {
      "matches": ["*://*.mozilla.org/*"],
      "js": ["borderify.js"]
    }
  ]

}

and says

The most interesting key here is content_scripts, which tells Firefox to load a script into Web pages whose URL matches a specific pattern. In this case, we're asking Firefox to load a script called "borderify.js" into all HTTP or HTTPS pages served from "mozilla.org" or any of its subdomains.

So in your manifest, change "*://*.mozilla.org/*" to something which matches the page you want to run your script on.

The content script ("borderify.js") should be able to access the DOM of that page using standard methods like querySelector.