Как манипулировать HTML элементами, со своего расширения Chrome?

Question

[Archakov Dennis]

Я решил написать расширение для Вконтакте (да, банальная тема) , с помощью которого хотел поменять некоторые значения и добавить кнопок на саму страницу.

Проблема в том, что изменять или получать значения из документа у меня не получается. Максимум, что могу сделать, это вызывать alert().

Вот код script.js:

chrome.tabs.onUpdated.addListener(function(tabId, changedInfo, tab) {
                alert('1');
                console.log('222');
            });
chrome.tabs.onCreated.addListener(function(tab) {
                alert('2');
            });

Сам манифиест:

{
  "name": "VKHelper",
  "version": "1.0",
  "manifest_version": 2,
  "description": "VKHelper - расширение для работы с ВК.",
  "background": {
    "scripts": ["script.js"]
  },
  "icons": {
    "16" : "images/GB-19.png",
    "48" : "images/GB-48.png",
    "128" : "images/GB-128.png"
  },
  "browser_action": {
    "default_icon": "images/GB-19.png",
    "default_title": "VKHelper",
    "default_popup": "popup.html"
  },
  "permissions": [ "contextMenus", "tabs", "storage" , "http://*/*", "https://*/*" ]
}

Юзал document.getElementsByClassName, нет реакции. Как обратиться к документу самой страницы и произвести манипуляции с его элементами? И как в консоли выводить значения, чтобы я могу следить за процессом, а то даже в консоль ничего не добавляет.

Answer 1

[littleguga]

Вот раз ответ
и два

Нужно использовать content scripts