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.


The readonly readyState attribute exposes the current document readiness of the page within the browser tab.

An HTML or XML file has its current document readiness set to loading when it is created, and complete when the file has finished loading. When the value is set by the browser or other user agent, a simple event called readystatechange is fired on the Document object.


readonly DOMString readyState // maps to document.readyState


The following example creates a button on the browser toolbar. Then, a new tab is created and given focus. When the tab's page has finished loading, the button's badge turns green.

// The background process (e.g. index.html)

// Specify the properties of the button before creating it.
var UIItemProperties = {
  disabled: false,
  title: "Example extension",
  icon: "images/icon_18.png",
  badge: {
    backgroundColor: '#cc0000',
    color: '#ffffff',
    textContent: '-'

// Create the button and add it to the toolbar.
var button = opera.contexts.toolbar.createItem( UIItemProperties );

// Create a new tab and give it focus
var tab = opera.extension.tabs.create({url: '../../../', focused: true});

// Start a timed loop
var loop = setInterval(function() {

  // When the page has finished loading, turn the badge green
  if (tab.readyState === 'complete') {
    button.badge.backgroundColor = '#00cc00';
    button.badge.textContent = '✓';

    // Don't forget to stop the loop
}, 100);

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


  • photo

    Martin Kadlec

    Wednesday, May 16, 2012

    Is the interval only solution to wait for new tab to load? If so, do you plan to add some listeners? This solutions feels really non-javascript-like and weird.
  • photo

    Martin Kadlec

    Wednesday, May 16, 2012

    Also it is weird that readyState is string and not number like in XHR.
  • photo


    Monday, June 4, 2012

    Do I need to create a tab or does this work for existing tabs too, for example when reloading or clicking on a link?
No new comments accepted.