我需要一个通用的javascript“等待功能可用”

在JavaScript中，实现“等待功能可用”的方法有很多，以下是一些通用的方法：

使用setTimeout函数

function waitForElement(element) {
  setTimeout(() => {
    // 检查元素是否已经加载完成
    if (element.isConnected) {
      // 执行相关操作
      console.log("元素已加载完成");
    } else {
      // 继续等待
      waitForElement(element);
    }
  }, 1000); // 等待1秒
}

// 使用示例
waitForElement(document.querySelector("#my-element"));

使用Promise和async/await

async function waitForElement(element) {
  const startTime = performance.now();
  while (true) {
    // 检查元素是否已经加载完成
    if (element.isConnected) {
      // 执行相关操作
      console.log("元素已加载完成");
      break;
    }
    const currentTime = performance.now();
    const timeElapsed = currentTime - startTime;
    await new Promise(resolve => setTimeout(resolve, 1000 - timeElapsed));
  }
}

// 使用示例
(async () => {
  try {
    const startTime = performance.now();
    const element = await waitForElement(document.querySelector("#my-element"));
    // 在这里执行相关操作
  } catch (error) {
    console.error(error);
  }
})();

使用MutationObserver监听DOM变化

const observer = new MutationObserver(mutations => {
  mutations.forEach(mutation => {
    Array.from(mutation.addedNodes).forEach(addedNode => {
      if (addedNode.matches && addedNode.matches("#my-element")) {
        // 执行相关操作
        console.log("元素已加载完成");
      }
    });
  });
});

// 使用示例
observer.observe(document.body, { childList: true, subtree: true });

这些方法都可以实现“等待功能可用”的效果，具体应