Как добавить jquery на любую веб-страницу

Есть ли способ вставить jQuery на любую страницу, как с javascript (с URL-адреса). с javascript мы делаем это

javascript:alert("b");

Я пробовал это, но я не знаю, почему он не работает

javascript:var x = document.getElementsByTagName("head")[0];
var y = document.createElement("script");
y.src = "http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js";
x.appendChild(y);

var a = document.getElementsByTagName("body")[0];
var b = document.createElement("script");
b.innerHTML = "$('p').css('border','3px solid red')"
a.appendChild(b);

Ответ 1

Это код букмарклета для ввода jquery на любой веб-странице:

javascript:(function() {
    function l(u, i) {
        var d = document;
        if (!d.getElementById(i)) {
            var s = d.createElement('script');
            s.src = u;
            s.id = i;
            d.body.appendChild(s);
        }
    }
    l('//code.jquery.com/jquery-3.2.1.min.js', 'jquery')
})();

Update: Я удалил http: часть из URL-адреса за комментарий @Monkpit, что очень важно и сэкономит массу проблем.

Ответ 2

Поскольку вы загружаете jQuery асинхронно, переменная jQuery недоступна сразу. Это означает, что вы не можете использовать jQuery на следующей строке; вам нужно подождать, пока браузер загрузит jQuery и выполнит его.

Решение состоит в использовании одного из следующих методов:

использовать задержку (предположим, что script загружается через х секунд)
использовать опрос (отметьте typeof jQuery === "function" каждые x миллисекунд)
использовать параметр обратного вызова (добавить строку запроса, например ?callback=scriptloaded, требуется поддержка на стороне сервера)
использовать script элемент onload событие, как описано ниже

function injectScriptAndUse() {
  var head = document.getElementsByTagName("head")[0];
  var script = document.createElement("script");
  script.src = "//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js";
  script.onload = function() {
    $("p").css("border", "3px solid red");
  };
  head.appendChild(script);
}

<p>Paragraph</p>
<button onclick="injectScriptAndUse();">Click to load jQuery and change style of the paragraph</button>

Ответ 3

Вы забыли точку с запятой в строке 8. Это код без ошибок:

javascript:var x = document.getElementsByTagName("head")[0];
var y = document.createElement("script");
y.src = "http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js";
x.appendChild(y);
var a = document.getElementsByTagName("body")[0];
var b = document.createElement("script");
b.innerHTML = "$('p').css('border','3px solid red')";
a.appendChild(b);

Вы можете добавить jQuery в Chrome, разместив его как закладку. Просто скопируйте приведенный выше код, создайте новую закладку на случайном веб-сайте. Щелкните правой кнопкой мыши по закладке и выберите "Изменить", вставьте код в поле URL и выберите "Сохранить". Когда вы нажмете на закладку, будет введена jQuery script.

-Lucas