时间戳

首页 > 解决方案 > 如何在javascript中等待样式改变

javascript - 如何在javascript中等待样式改变

问题描述

我试图从单击按钮后出现的 div 中获取值

async function pollVisibility() {

  try {
    document.querySelector("#contact_methods > li").click()

    if (!$("#contact_methods > li > div > span").is(":visible")) {

      return document.querySelector("#contact_methods > li > div > strong").innerText

    } else {
      setTimeout(pollVisibility, 100);
    }
  } catch (e) {
    console.log(e)
  }
}

后来我称之为...

 let telephone = await pollVisibility();

但我仍然得到旧值（点击前）

标签： javascript

解决方案

要调整您当前的代码，请承诺 setTimeout，然后返回递归调用pollVisibility：

const delay = ms => new Promise(resolve => setTimeout(resolve, ms));
async function pollVisibility() {
  try {
    document.querySelector("#contact_methods > li").click()
    if (!$("#contact_methods > li > div > span").is(":visible")) {
      return document.querySelector("#contact_methods > li > div > strong").innerText
    } else {
      return delay(100).then(pollVisibility);
    }
  } catch (e) {
    console.log(e)
  }
}

虽然try/catch很奇怪 - 如果这是您完整的真实代码，最好先明确测试以查看有问题的元素是否存在，而不是运行可能导致抛出错误的代码。

除非您的实际代码也包含await在其中，否则也不需要该函数async。（要确保返回的值是第一次迭代的 Promise，请将其包装在 中Promise.resolve）

推荐阅读