javascript - Google Chrome extensions document.title not working - Stack Overflow

here is the code in the manifest.json

{
  "name": "Page Title changer",
  "version": "1.0",
  "description": "Change the <title></title> of a page",
  "browser_action": {
    "default_icon": "icon.png"
  },
  "content_scripts": [
    {
      "matches": ["http://*/*"],
      "js": ["changetitle.js"]
    }
  ]
}

and here is the code from the changetitle.js file

chrome.browserAction.onClicked.addListener(function() {
    document.title = 'new page title';
});

i don't understand why it isn't working, i checked the google code docs while writing this extension.

here is the code in the manifest.json

{
  "name": "Page Title changer",
  "version": "1.0",
  "description": "Change the <title></title> of a page",
  "browser_action": {
    "default_icon": "icon.png"
  },
  "content_scripts": [
    {
      "matches": ["http://*/*"],
      "js": ["changetitle.js"]
    }
  ]
}

and here is the code from the changetitle.js file

chrome.browserAction.onClicked.addListener(function() {
    document.title = 'new page title';
});

i don't understand why it isn't working, i checked the google code docs while writing this extension.

• javascript
• json
• google-chrome-extension

Share Improve this question Follow edited Oct 5, 2011 at 0:46 Daniel Brockman 19.3k33 gold badges3131 silver badges4343 bronze badges asked Oct 5, 2011 at 0:43 SamuelSamuel 17544 silver badges1111 bronze badges 1

• if you wanna setup document.title, you must have <title> – Eric Yin Commented Jun 25, 2012 at 18:36

Add a ment  | 

3 Answers 3

Sorted by: Reset to default 3

As detailed in the documentation you cannot use chrome.* API within content scripts except for some chrome.extension.* methods.

However, this doesn't really limit you as you can use messaging to call your content script from your background page. For example;

background.html

<script type="application/javascript">
chrome.browserAction.onClicked.addListener(function() {
    chrome.tabs.getSelected(function (tab) {
        chrome.tabs.sendRequest(tab.id, {title: 'new page title'}, function (response) {});
    });
});
</script>

changetitle.js

chrome.extension.onRequest.addListener(function (request, sender, sendResponse) {
    document.title = request.title;
});

You will of course require the tabs permission in order to use this technique.

This one will work in any URI Scheme

manifest.json

{
  "name": "Page Title changer",
  "version": "1.0",
  "description": "Change the <title></title> of a page",
  "browser_action": {
    "default_icon": "icon.png"
  },
  "background_page": "background.html",
  "permissions": [
        "tabs"
  ]
}

background.html

chrome.browserAction.onClicked.addListener(function () {
    chrome.tabs.executeScript(null, {
        file: "changetitle.js"
    });
});

changetitle.js

document.title = 'new page title';

Try this:

chrome.browserAction.onClicked.addListener(function () {
    chrome.tabs.executeScript(null, {
        code: "document.title = 'new page title'"
    });
});