Добавить скрипт в тело, используя пользовательский скрипт Chrome

Question

Я хочу добавить скрипт на заданную страницу с помощью пользовательского скрипта в стиле Greasemonkey в Chrome.

Я использую этот трюк , чтобы добавить jQuery в мой пользовательский скрипт.

Если я пытаюсь добавить, например, <h1>Test</h1> к телу страницы с помощью метода добавления jQuery, все работает нормально.

Однако, если я пытаюсь добавить JS-скрипт, ничего не происходит.

Как мне устранить проблему, подобную этой?

Это мой .user.js-файл:

// ==UserScript==
// @match http://*/*
// ==/UserScript==

// a function that loads jQuery and calls a callback function when jQuery has finished loading
function addJQuery(callback) {
  var script = document.createElement("script");
  script.setAttribute("src", "http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js");
  script.addEventListener('load', function() {
    var script = document.createElement("script");
    script.textContent = "(" + callback.toString() + ")();";
    document.body.appendChild(script);
  }, false);
  document.body.appendChild(script);
}

// the guts of this userscript
function main() {

$(document).ready(function() {
    $('body').append('<script type="text/javascript" src="http://timkl.com/wip/bibobRedesign/js/jquery.contenthack.js"></script>');
});

}

// load jQuery and execute the main function
addJQuery(main);

Answer 1

jQuery обрабатывает элементы скрипта иначе, чем другие элементы DOM.В этом ответе .

есть дополнительная информация. Чтобы добавить ваш скрипт, самый безопасный способ - использовать тот же метод, который используется для вставки библиотеки jQuery.

function main() {
    var script = document.createElement("script");
    script.setAttribute("src", "http://timkl.com/wip/bibobRedesign/js/jquery.contenthack.js");
    document.body.appendChild(script);
    $(document).ready(function () {
        //$('body').append();
    });
}

Не проверенный вариант Если у вас есть много скриптов для загрузки, взгляните на загрузчик скриптов (например, LABjs )

Вы можете сделатьчто-то вроде следующего:

function addLABjs(callback) {
    var script = document.createElement("script");
    script.setAttribute("src", "http://somepath.to/LAB.js");
    script.addEventListener('load', function () {
        var script = document.createElement("script");
        script.textContent = "(" + callback.toString() + ")();";
        document.body.appendChild(script);
    }, false);
    document.body.appendChild(script);
}

// the guts of this userscript


function main() {
    $LAB.script("http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js").wait()
        .script("http://timkl.com/wip/bibobRedesign/js/jquery.contenthack.js")
        .script("YourOtherScript.js").wait();

    $(document).ready(function () {
    });
}

addLABjs(main);