Javascript 如何将 jquery 注入任何网页

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/26573076/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-22 23:05:00  来源:igfitidea点击:

How to inject jquery to any webpage

javascriptjquerycode-injection

提问by elti musa

Is there any way to inject jQuery into any page as we do with javascript(from url). with javascript we do this

有什么方法可以像我们使用 javascript(来自 url)那样将 jQuery 注入任何页面。使用 javascript 我们做到这一点

javascript:alert("b");

I tried this but I don't know why it dosen't work

我试过这个,但我不知道为什么它不起作用

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);

回答by Amr Elgarhy

This is a bookmarklet code to inject jquery in any webpage:

这是在任何网页中注入 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:I removed the http: part from the URL per @Monkpit comment, which is very important and saves a lot of problems.

更新:我从每个@Monkpit 评论的 URL 中删除了 http: 部分,这非常重要并且节省了很多问题。

回答by Salman A

Since you are loading jQuery asynchronously, the jQueryvariable is not available immediately. This means you cannot use jQuery on the next line; you need to wait until the browser loads jQuery and executes it.

由于您正在异步加载 jQuery,因此该jQuery变量无法立即使用。这意味着您不能在下一行使用 jQuery;您需要等到浏览器加载 jQuery 并执行它。

The solution is to use one of the following techniques:

解决方案是使用以下技术之一:

  1. use delay (assume that the script loads after x seconds)
  2. use polling (check typeof jQuery === "function"every x milliseconds)
  3. use callback parameter (append query string such as ?callback=scriptloaded, requires server- side support)
  4. use script element's onloadevent as described below
  1. 使用延迟(假设脚本在 x 秒后加载)
  2. 使用轮询(typeof jQuery === "function"每 x 毫秒检查一次)
  3. 使用回调参数(附加查询字符串,例如?callback=scriptloaded,需要服务器端支持)
  4. 使用脚本元素的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>

回答by Salman A

You forgot a semicolon in row 8. This is the code without errors:

你忘记了第 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);

You can inject jQuery in Chrome by putting it as a bookmark. Just copy the code above, create a new bookmark of a random website. Right click on the bookmark and choose 'Edit', paste the code in the URL box and choose 'Save'. When you click on the bookmark the jQuery script will be injected.

您可以将 jQuery 放入 Chrome 中,将其作为书签。只需复制上面的代码,创建一个随机网站的新书签。右键单击书签并选择“编辑”,将代码粘贴到 URL 框中并选择“保存”。当您单击书签时,将注入 jQuery 脚本。

-Lucas

-卢卡斯