StackOverflow2013

Note that there are some explanatory texts on larger screens.

plurals

PO
text
Body
copied!<p>JavaScript code in Chrome extensions can be divided in the following groups:</p> <ul> <li><p><strong>Extension code - Full access to all permitted <a href="http://developer.chrome.com/extensions/api_index.html" rel="noreferrer"><code>chrome.*</code></a> APIs.</strong><br> This includes the <a href="http://developer.chrome.com/extensions/background_pages.html" rel="noreferrer">background page</a>, and all pages which have direct access to it via <a href="http://developer.chrome.com/extensions/extension.html#method-getBackgroundPage" rel="noreferrer"><code>chrome.extension.getBackgroundPage()</code></a>, such as the <a href="http://developer.chrome.com/extensions/browserAction.html" rel="noreferrer">browser pop-ups</a>.</p></li> <li><p><strong><a href="http://developer.chrome.com/extensions/content_scripts.html" rel="noreferrer">Content scripts</a> (via the manifest file or <a href="http://developer.chrome.com/extensions/tabs.html#method-executeScript" rel="noreferrer"><code>chrome.tabs.executeScript</code></a>) - <a href="http://developer.chrome.com/extensions/extension.html#content%20scripts" rel="noreferrer">Partial</a> access to some of the <code>chrome</code> APIs</strong>, full access to the page's DOM (<strong>not</strong> to any of the <code>window</code> objects, including frames).<br> Content scripts run in a scope between the extension and the page. The global <code>window</code> object of a Content script is distinct from the page/extension's global namespace.</p></li> <li><p>Injected scripts (via <a href="https://stackoverflow.com/a/9517879/938089?building-a-chrome-extension-inject-code-in-a-page-using-a-content-script">this method</a> in a Content script) - Full access to all properties in the page. <strong>No access to any of the <code>chrome.*</code> APIs.</strong><br> Injected scripts behave as if they were included by the page itself, and are not connected to the extension in any way. See <a href="https://stackoverflow.com/a/9517879/938089?building-a-chrome-extension-inject-code-in-a-page-using-a-content-script">this post</a> to learn more information on the various injection methods. </p></li> </ul> <p>To send a message from the injected script to the content script, events have to be used. See <a href="https://stackoverflow.com/q/9602022/938089?chrome-extension-retrieving-gmails-original-message">this answer</a> for an example. Note: Message transported within an extension from one context to another are <strong>automatically (JSON)-serialised and parsed</strong>.</p> <hr> <p>In your case, the code in the background page (<a href="http://developer.chrome.com/extensions/tabs.html#event-onUpdated" rel="noreferrer"><code>chrome.tabs.onUpdated</code></a>) is likely called before the content script <code>script.js</code> is evaluated. So, you'll get a <code>ReferenceError</code>, because <code>init</code> is not .</p> <p>Also, when you use <code>chrome.tabs.onUpdated</code>, make sure that you test whether the page is fully loaded, because the event fires twice: Before load, and on finish:</p> <pre><code>//background.html chrome.tabs.onUpdated.addListener(function(tabId, changeInfo, tab) { if (changeInfo.status == 'complete') { // Execute some script when the page is fully (DOM) ready chrome.tabs.executeScript(null, {code:"init();"}); } }); </code></pre>

Querying!

Guidance

An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload