更新时间:2022-03-13 00:30:10
Angular在加载页面后很好地修改了DOM,所以你需要一些方法来等待你关心的事件或节点。
Angular modifies the DOM well after the page is loaded, so you need some way to wait for the events or nodes you care about.
此外,您必须保持代码(尤其是jQuery)不会干扰页面的代码。这意味着你应该努力保持沙盒开启。
Also, you must keep your code (especially jQuery) from interfering with the page's code. This means you should endeavor to keep the sandbox switched on.
对于Firefox + Greasemonkey或Chrome + Tampermonkey(或大多数支持的引擎@require
指令),您可以使用 waitForKeyElements()实用程序和 @grant
指令来实现这些目标。
For Firefox+Greasemonkey or Chrome+Tampermonkey (or most engines that support the @require
directive), you can use the waitForKeyElements() utility and the @grant
directive to accomplish these goals.
这个完整的示例脚本适用于FF + GM和Chrome + TM:
This complete, sample script will work on both FF+GM and Chrome+TM:
// ==UserScript==
// @name _Add a div after .nav elements
// @include http://YOUR_SERVER.COM/YOUR_PATH/*
// @require http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js
// @require https://gist.github.com/raw/2625891/waitForKeyElements.js
// @grant GM_addStyle
// ==/UserScript==
/*- The @grant directive is needed to work around a design change
introduced in GM 1.0. It restores the sandbox.
*/
waitForKeyElements (".nav", addTestDiv);
function addTestDiv (jNode) {
jNode.after ('<div>test</div>');
}
如果您使用的引擎不支持 @require
指令(如直接的Chrome用户脚本),请切换! Tampermonkey值得转换。
If you are using an engine that doesn't support the @require
directive (like a straight Chrome userscript), switch! Tampermonkey is worth switching to.