【发布时间】：2021-02-26 20:10:10
【问题描述】：
我正在玩 GreaseMonkey，试图检测页面上的新 cmets。我的 Javascript 很生锈。我发现了这个 waitForKeyElements() 脚本，这似乎很有帮助。我看到它正在使用 jQuery，并且我查看了 JQuery 通配符选择器，但它不起作用。
我什至找到了this question and answer here 和this one about jQuery selector id ends with，但仍然无法正常工作。
聊天消息由<div> 和id="chat-messages-12345randomNum" 标识。
这是我尝试过的：
// ==UserScript==
// @name Chat listener
// @include https://chatSite.com/*
// @require http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js
// @require https://gist.github.com/raw/2625891/waitForKeyElements.js
// ==/UserScript==
console.log("hello world");
function findNewComments (jNode) {
console.log("found comment " + jNode);
}
waitForKeyElements ("div[id$='chat-messages']", findNewComments);
“hello world”在控制台中，所以我知道至少脚本正在加载。
我在选择器中使用和不使用 div 都试过了，都没有。
【问题讨论】：
-
您能否提供一个minimal reproducible example 您尝试选择的站点/标记/JS 行为？
document.querySelector("#chat-messages-12345randomNum")有问题吗？在进入一堆库之前，我会尝试选择一个元素。谢谢 -
感谢您的快速回复，但我不明白；我对
<div id="chat-messages-12345"...>的描述如何，这就是我试图捕捉的不够？ -
也许是这样，在这种情况下使用上面显示的查询选择器来选择它。有时（实际上一直）元素是异步创建的，以响应油脂猴脚本运行后将发生的网络请求、点击和 JS 事件。所以如果上面的选择器不起作用，那么页面可能比你想象的要复杂。在这种情况下，
<div id="whatever"></div><script>document.querySelector("#whatever")</script>本质上就是您在此处显示的内容，还不足以进行复制，还需要更多上下文。可能需要MutationObserver或网络拦截器。 -
另外，
12345randomNum在每次页面加载时实际上是不同的，还是您可以指望现有的固定“随机”数字？如果每个页面加载不同，您可以使用哪些其他识别特征来识别此元素？如果您不介意分享 URL，它会更容易提供帮助。 -
是的，我假设这些是为了响应网络请求而异步创建的。它是主要的协作网站之一（Slack、Teams、Discord 等），因此肯定更加复杂。每个新的聊天消息 div 都有一个新的 chat-messages-idNum，但是这些 id 中的每一个都会在页面重新加载时持续存在，所以如果我知道一个，我可以指望它存在。
标签： javascript jquery greasemonkey