Injected scripts

By Opera Software

From Opera 15 onward, Opera 11 & 12’s extension format is no longer supported, and instead, we’ve switched to Chromium’s extension model. Check out our new documentation for developing extensions for Opera 15 and higher and start building your own extensions.

opera.addEventListener()

Registers a listener for an event specific to the injected script side.

opera.removeEventListener()

Removes an existing listener from an event.

opera.defineMagicFunction()

This method can be used to override global functions defined by regular scripts in a page.

opera.defineMagicVariable()

This method can be used by to override global variables defined by regular scripts in a page.

opera.postError()

Makes a given text string appear in the Error Console. Helpful for debugging.

Overview

You can add JavaScript to a website using "injected scripts". These are normal JavaScript files located inside the "includes" folder in the extension. Opera will execute the given scripts on either all pages, or certain sites and domains they have been targeted for.

You can, for example, create injected scripts that hide comments on YouTube that are written in upper case, or show all text links on all web pages in pink.

Note that injected scripts are essentially User JavaScript, which Opera has supported for a while, and for which we have existing UserJS documentation which includes tutorials, examples and API specification.

Examples

The below example is an injected script (/includes/injectedScript.js) that adds a tooltip (using the title attribute) to all links on BBC News (but not on BBC Sport).

// ==UserScript==
// @include http://www.bbc.co.uk/news/*
// @include http://news.bbc.co.uk/*
// @exclude http://news.bbc.co.uk/sport/*
// ==/UserScript==

window.addEventListener('DOMContentLoaded', function() {

  // Loop through all  elements (links) in the page
  var links = document.querySelectorAll('a');
  for (var i = 0, len = links.length; i < len; i++) {
    // For each link, show the URL as a title attribute (tooltip)
    links[i].title = links[i].href;
  }
}, false);

Below is another example, this time showing how the injected script can send messages to the backgrond process. For more information on how to send messages between injected scripts and other parts of an extension take a look at the messaging guide.

The injected script (e.g. /includes/injectedScript.js):

// ==UserScript==
// @include http://*.facebook.com/*
// ==/UserScript==

opera.extension.postMessage("He's on facebook again!");

The background script (e.g. within index.html):

//
// Store the number of Facebook visits in the extension's preferences
//

// Get the current Facebook visit count, or zero if it doesn't exist
var facebookCount = (widget.preferences['facebookCount']) ? widget.preferences['facebookCount'] : 0;

// Listen for injected script messages
opera.extension.onmessage = function(event) {
  // User has been on facebook again
  if (event.data === "He's on facebook again!") {
    facebookCount += 1;
  }

  // Store the updated count in the preferences
  widget.preferences['facebookCount'] = facebookCount;
};

This article is licensed under a Creative Commons Attribution 3.0 Unported license.