Firefox DevTools:自动注入jQuery

Firefox DevTools: Automatically injecting jQuery

本文关键字：注入 jQuery DevTools Firefox      更新时间：2023-09-26

我在开发工具中做了很多工作，喜欢在控制台中使用jQuery来运行代码片段。为了将jQuery注入页面（和控制台），我将其粘贴到devtools控制台：

var j = document.createElement('script'); j.src = "//ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"; document.getElementsByTagName('head')[0].appendChild(j);

有没有一种方法可以将jQuery自动注入开发人员工具控制台？理想情况下，不影响当前页面的window.$或window.jQuery。

开发人员工具栏有一个注入命令，可以更容易地将脚本注入当前页面。它支持常用的库，如jQuery和下划线。有关更多信息，请参阅我链接到的文档。

如果你想总是这样做，你可以创建一个类似于dotjs的插件——主要的区别是你需要将jQuery对象公开到页面的实际DOM中，内容脚本还不够好。您可能还应该始终尝试检测现有的jQuery？我不太清楚你们说的"不影响窗户"是什么意思或window.jQuery for the current page'-控制台的当前作用域默认为当前页面。只有当您正在调试并且在其他范围内的断点处停止时，情况才会有所不同。

您可以将以下代码复制/粘贴到控制台中，jQuery将在DevTools 中提供

var jq = document.createElement('script');
jq.src = "https://ajax.googleapis.com/ajax/libs/jquery/2.2.4/jquery.min.js";
document.getElementsByTagName('head')[0].appendChild(jq);
// ... You might need to also run
jQuery.noConflict();

您可能会立即看到一个错误：Uncaught ReferenceError: jQuery is not defined.忽略它-DevTools正在拖你的后腿。（也许是谷歌在幽默方面的软弱尝试…）

然后，在DevTools控制台中测试它：
$('div').length; //press Enter

如果出现错误，请尝试以下方法：
jQuery('div').length

希望第一种方法能起作用，但有时你需要使用第二种方法。

相关文章：