设置 href 后，如何在延迟后单击锚标记？

Question

有一个页面的锚标记在延迟后变为可点击。一旦可点击，我想使用用户脚本来点击它。

页面加载时，HTML 来源是：

<div id="buton" style="display:none">
  <div class="info-link right">
    <a href="#">Download</a>
  </div>
</div>

延迟一段时间后，#button变为可见，HTML变为：

<div id="buton" style="">
  <div class="info-link right">
    <a href="http://178.32.87.115/jetapi/mali.php?go=aHR0cHM6Ly9vdXJsLmlvLzZpN0Mw" data-ss1536034362="1">Download</a>
  </div>
</div>

我尝试使用此代码点击它 in JSFiddle，运行成功：

document.querySelector('.info-link.right a').click()

然而，当我在实际 website here 上尝试时（使用 tampermonkey），没有任何反应。我该怎么办？

Answer 1

您需要等到元素的 href 被重新分配后才能单击它。幸运的是，您的网站是静态的，并且 <a> 在页面加载时位于 HTML 中，因此可以立即选择它 - 然后，您可以使用 MutationObserver 观察它，以便一旦它href变了，你可以click()就可以了。

// ==UserScript==
// @name         clickit
// @namespace    CertainPerformance
// @version      1
// @match        http://178.32.87.115/jetapi/?file=28941536032773
// @grant        none
// ==/UserScript==

const a = document.querySelector('.info-link > a');

const observer = new MutationObserver(() => {
  a.click();
});
observer.observe(a, { attributes: true });

请注意，如果站点不是静态的，并且 <a> 在页面加载时不存在，您将不得不做其他事情，也许使用setInterval 并不断检查页面是否有 a 其 href 符合您的要求：

setInterval(() => {
  const a = document.querySelector('a[href^="http://178.32.87.115/jetapi/mali.php?go="]');
  if (a) a.click();
}, 50);

设置 href 后，如何在延迟后单击锚标记？

How do I click on an anchor tag once its href gets set, after a delay?

javascript

tampermonkey