Как написать расширение для Chrome меняющее исходный код страницы?

/jquery.js (если лень писать vanilla js)

/manifest.json

{
  "name": "JS Code Injection",
  "version": "1.0",
  "manifest_version": 2,
  "content_scripts": [
    {
      "matches": [ "http://extension.target.url" ],
      "js": [ "jquery.js", "background.js" ],
      "run_at": "document_end"
    }
  ],
  "web_accessible_resources": [
    "/injected.js"
  ]
}

/injected.js

function injected_main() {
    alert('Вот тут пишешь свой javascript код который будет жедать то, что нужно');
}

/background.js

$.get(chrome.extension.getURL('/injected.js'), 
    function(data) {
        var script = document.createElement("script");
        script.setAttribute("type", "text/javascript");
        script.innerHTML = data;
        document.getElementsByTagName("head")[0].appendChild(script);
        document.getElementsByTagName("body")[0].setAttribute("onLoad", "injected_main();");
    }
);

1. Мы используем стандартную функцию Chrome Extension API chrome.extension.getURL(), которая возвращает путь, локальный для расширения.
2. Далее мы запрашиваем данный файл через ajax и после успешного получения создаем новый элемент в основной странице (Благодаря Shared DOM мы можем манипулировать элементами страницы без лишних усилий)
3. Последним пунктом мы устанавливаем функцию, которая будет вызвана после загрузки страницы (функция injected_main() описана в файле injected.js)