如何直接在浏览器的任何页面上运行jQuery?

是否有一些编程方式或者一个浏览器插件允许用户在他们的浏览器中当前加载的网页上随意运行他们想要的任何jQuery?

编辑

我的动机是能够在页面上提前测试jQuery语法和命令,然后将它们添加到其源代码或建议调整我尝试过的页面的webadmins。

FireQuery是一个很棒的Firebug扩展,可以包含jQuery,从那里你可以在你的控制台中使用jQuery。

“jQuerify:使您能够将jQuery注入任何网页”

您可以使用Chrome控制台执行此操作。 如果您使用的是Chrome,请右键单击该页面,然后点击“检查元素”。 转到“控制台”选项卡并尝试运行$ === jQuery 。 如果你没有得到错误并且结果为true ,那你就得到了jQuery。

如果没有,请运行以下命令将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); 

运行这些命令后,应该将jQuery加载到任何网页中并准备在控制台中使用:)

上述代码适用于任何带有JavaScript控制台的浏览器。

或者,有一些用户脚本(如Greasemonkey和FireQuery),如果页面中没有包含jQuery,它会自动运行上面的代码来注入jQuery,以便您轻松编写脚本并攻击其他人的页面。

这使用谷歌CDN,它的HTTP友好,单行,并包装:

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

您可以指定jQuery的版本,例如jQueryVersion="2.0.2"

所有版本都列在developers.google.com/speed/libraries/devguide中 。

为了方便注入 (并表明它的存在) jQuery在Chrome中甚至进入HTTPS页面,与Prototype 没有冲突模式(表明原型是否也存在于页面上)你可能更喜欢jQuerify扩展( jQuerify for Chrome )的质量在几年的经验中成千上万的用户certificate了这一点。 用一句话说:“ 节省你的时间 ”。

我编写了一个bookmarklet来检查文档的jQuery,如果它还不存在则将其添加到 ,如果jQuery是通过脚本加载的,或者已经存在于文档中,则会显示通知(使用jQuery)。 只需将此代码添加到书签即可获得以下function:

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

对于firefox中的开发,您可以使用Firebug和FireQuery 。

看一下这个:

jQuery Bookmarklet Generator http://benalman.com/projects/run-jquery-code-bookmarklet/

eval执行您传递的任何字符串,但如果它的用法是“正确的”则会受到质疑 。

 eval('$(function() { alert("hello"); }'); 

将在文档就绪时显示警告(前提是在调用eval之前获取jQuery)。