如何直接在浏览器中的任何页面上运行 jQuery？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/8508514/
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
How to run jQuery directly on any page in the browser?
提问by pulkitsinghal
Is there some programmatic way or maybe a browser plugin that allows users to arbitrarily run any jQuery they want on a webpage that is currently loaded in their browser?
是否有某种编程方式或浏览器插件允许用户在当前加载到浏览器中的网页上任意运行他们想要的任何 jQuery？
Edit
编辑
My motivation is to be able to test jQuery syntax and commands ahead of time on a page and then go add them to its source or suggest tweaks to the webadmins whose pages I experimented with.
我的动机是能够提前在页面上测试 jQuery 语法和命令，然后将它们添加到其源代码或向我试验过的页面的网络管理员提出调整建议。
采纳答案by Stefan
回答by Naftuli Kay
You can use Chrome's console to do it. If you're using Chrome, right click the page, then click "Inspect Element." Go over to the "Console" tab and try running $ === jQuery. If you don't get an error and the result is true, you've got jQuery.
您可以使用 Chrome 的控制台来执行此操作。如果您使用的是 Chrome，请右键单击该页面，然后单击“检查元素”。转到“控制台”选项卡并尝试运行$ === jQuery. 如果您没有收到错误并且结果是true，那么您就拥有了 jQuery。
If not, run the following to add jQuery to a page:
如果没有，请运行以下命令将 jQuery 添加到页面：
var body = document.getElementsByTagName("body")[0];
var script = document.createElement('script');
script.type = "text/javascript";
script.src = "http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js";
body.appendChild(script);
After running these commands, jQuery should be loaded into any web page and ready for use in the console :)
运行这些命令后，jQuery 应该被加载到任何网页并准备在控制台中使用:)
The above code should work for any browser with a JavaScript console.
上面的代码应该适用于任何带有 JavaScript 控制台的浏览器。
Alternatively, there are userscripts (like Greasemonkey and FireQuery) which, if jQuery isn't included on the page, automatically run the above code to inject jQuery to make it easy for you to script and hack on other people's pages.
或者，有用户脚本（如 Greasemonkey 和 FireQuery），如果页面中未包含 jQuery，则会自动运行上述代码以注入 jQuery，以便您轻松编写脚本并破解其他人的页面。
回答by Luqmaan
This uses the Google CDN, and it's HTTPs friendly, one-line, and wrapped:
这使用了 Google CDN，它是 HTTPs 友好的、单行的和包装的：
(function(){var jQueryVersion="1";var a=document.createElement("script");a.src="//ajax.googleapis.com/ajax/libs/jquery/"+jQueryVersion+"/jquery.js";a.type="text/javascript";document.getElementsByTagName("head")[0].appendChild(a);})()
You can specify the version of jQuery, e.g. jQueryVersion="2.0.2".
您可以指定 jQuery 的版本，例如jQueryVersion="2.0.2".
All versions are listed at developers.google.com/speed/libraries/devguide.
回答by Intervoice
For convenience to inject(and indicate it's presense) jQuery in Chromeeven into the HTTPSpage with no-conflictmode to Prototype(indicates if Prototype is present on the page too) You probably would prefer jQuerifyextension (jQuerify for Chrome) quality of which was proved by thousands of usersduring several years of experience. In one phrase: "Save your time".
为了方便在 Chrome 中注入（并表明它是存在的）jQuery甚至进入HTTPS页面，并且没有冲突模式到Prototype（表明 Prototype 是否也存在于页面上）您可能更喜欢jQuerify扩展（jQuerify for Chrome）的质量经过数年的经验，被成千上万的用户所证明。一句话概括：“节省您的时间”。
回答by Aaron
I wrote a bookmarklet that checks the document for jQuery, adds it to the <head>if it doesn't already exist, and displays a notification (using jQuery) if jQuery was either loaded via the script or already present in the document. Just add this code to your bookmarks to get the functionality:
我编写了一个书签，用于检查文档中的 jQuery，<head>如果它不存在，则将其添加到，并在 jQuery 是通过脚本加载或已存在于文档中时显示通知（使用 jQuery）。只需将此代码添加到您的书签即可获得功能：
javascript: (function()
{
var body = document.getElementsByTagName("body")[0];
var head = document.getElementsByTagName("head")[0];
var el = document.createElement('div');
el.id = 'jqbkstatusnote';
el.style.position = 'fixed';
el.style.top = '10px';
el.style.left = '10px';
el.style.textAlign = 'center';
el.style.color = '#fff';
el.style.padding = '3px';
el.style.fontWeight = 'bold';
el.style.display = 'none';
el.style.zIndex = '999999999';
el.style.boxShadow = '0px 0px 0px 1px #fff, 3px 3px 1px rgba(0,0,0,0.5)';
if (typeof jQuery != 'function')
{
var script = document.createElement('script');
script.type = "text/javascript";
script.src = "http://code.jquery.com/jquery-latest.min.js";
head.appendChild(script);
waitForJQ();
}
else
{
el.style.border = '1px solid #522';
el.style.backgroundColor = '#744';
el.innerHTML = 'jQuery already exists in this document!';
body.appendChild(el);
jQuery('#jqbkstatusnote').fadeIn().delay(1000).fadeOut(function(){jQuery(this).remove();});
}
function waitForJQ()
{
if (typeof jQuery != 'function')
{
window.setTimeout(waitForJQ, 100);
}
else
{
el.style.border = '1px solid #235';
el.style.backgroundColor = '#457';
el.innerHTML = 'jQuery added to document!';
body.appendChild(el);
jQuery('#jqbkstatusnote').fadeIn().delay(1000).fadeOut(function(){jQuery(this).remove();});
}
}
})();
回答by Ayman Safadi
Check this out:
看一下这个：
jQuery Bookmarklet Generator http://benalman.com/projects/run-jquery-code-bookmarklet/
jQuery 书签生成器 http://benalman.com/projects/run-jquery-code-bookmarklet/
回答by amit_g
For development in firefox you can use Firebugwith FireQuery.
对于在 firefox 中的开发，您可以将Firebug与FireQuery 结合使用。
