Question

我正在编写一个脚本，按下添加到购物车按钮，然后等到购物车商品数=当前商品数

现在，即使在if语句变为false之后，我似乎也无法摆脱我添加的if语句。

这是我尝试过的：

  $("#add-remove-buttons :input")[0].click();
  let cart_count = $("#items-count").text();
  if (cart_count !== `${request} items`){
    setInterval(function() {
      let cart_count = $("#items-count").text();
      console.log(cart_count, `${request} items`);
    }, 50);
  }
  if (cart_count == `${request} items`) {
    chrome.runtime.sendMessage({finished:"done_after1"});
  }

这是控制台中的结果：

正如您可以告诉它console.logged 1项2项，然后它转到2项2项，也就是应该停止并发送消息的时间。但是出于某种原因，它一直保留在控制台日志中

我也尝试了以下代码：

$("#add-remove-buttons :input")[0].click();
let cart_count = $("#items-count").text();
while (cart_count !== `${request} items`){
  let cart_count = $("#items-count").text();
  console.log(cart_count, `${request} items`);
}
chrome.runtime.sendMessage({finished:"done_after1"});

因此，应该在while循环不再成立之后退出while循环。但是由于某种原因，当我测试该页面时，该页面只是冻结了，甚至无法右键单击以检查控制台。出于某种原因，当我尝试使用while循环时，页面总是冻结。

如果有人知道这里出了什么问题，如果您能通过告诉我问题来帮助我，我将不胜感激。谢谢！ <3

Answer 1

只需将if移到setInterval中-您基本上必须在发生更改后执行脚本：

$("#add-remove-buttons :input")[0].click();
let cart_count = $("#items-count").text();
if (cart_count !== `${request} items`){
  setInterval(function() {
    let cart_count = $("#items-count").text();
    console.log(cart_count, `${request} items`);
  }, 50);
  if (cart_count == `${request} items`) {
    chrome.runtime.sendMessage({finished:"done_after1"});
  }
}

但是，别忘了也使用stopInterval。

使用计时器等待也不太理想。最好使用在更改某些内容时触发的事件。

Answer 2

由于#items-count似乎不是INPUT / TEXTAREA等（即可以与change事件一起使用的东西，因此可以按如下方式使用MutationObserver

注意：我假设是

$("#add-remove-buttons :input")[0].click();

需要单击直到值匹配-您的原始代码似乎只单击了一次

我还使用非jquery处理#items-count元素-因为我认为它更简单

function handler(node) {
    let check = first => { // when triggered by mutation event, the argument "first" will be undefined
        let cart_count = node.textContent;
        if (cart_count === `${request} items`) {
            chrome.runtime.sendMessage({finished:"done_after1"});
            return true; // stop observing
        } else { // didn't match
            if (first) { // this is the first call - add a MutationObserver
                new MutationObserver((mutationList, observer) => {
                    if(check()) { // call with no argument, because MutationObserver is already set up
                        observer.disconnect(); // condition is met, so stop observing
                    }
                }).observe(node, {
                    childList:true
                });
            }
            // condition is not met, so click the add button
            $("#add-remove-buttons :input")[0].click();
        }
        return false; // keep observing
    };
    check(true);
}
handler(document.querySelector('#items-count'));

但是，如果#items-count是发出change事件的元素-则更加简单

function handler(arg) { // when triggered by change event, arg will be defined
    let cart_count = $("#items-count").text();
    if (cart_count === `${request} items`) {
        if (arg) { // trigger by change event
            $("#items-count").off('change', handler);
        }
        chrome.runtime.sendMessage({finished:"done_after1"});
    } else {
        if (!arg) { // first call
            $("#items-count").change(handler);
        }
        $("#add-remove-buttons :input")[0].click();
    }
}
handler();

Answer 3

您不会在时间间隔内重新检查该值，因此消息只有一次发送的机会，这将在时间间隔执行之前的某个时间发生。

也许可以尝试更多类似的东西...

$("#add-remove-buttons :input")[0].click ();
let cart_count = $("#items-count").text ();

if (cart_count === `${request} items`) {
    chrome.runtime.sendMessage ({ finished: "done_after1" });
} else {
    let interval = setInterval (function () {
        let cart_count = $("#items-count").text ();

        if (cart_count == `${request} items`) {
            chrome.runtime.sendMessage ({ finished: "done_after1" });
            clearInterval (interval);
        }

        console.log (cart_count, `${request} items`);
    }, 50);
}

等到== JavaScript中的某些内容

3 个答案: