如何在javascript中等待带有超时的元素

function waitForElementWithTimeout(selector, timeout) {
  return new Promise((resolve, reject) => {
    const startTime = Date.now();
    
    function checkElement() {
      const element = document.querySelector(selector);
      
      if (element) {
        resolve(element);
      } else if (Date.now() - startTime >= timeout) {
        reject(new Error(`Timeout exceeded while waiting for element ${selector}`));
      } else {
        setTimeout(checkElement, 100);
      }
    }
    
    checkElement();
  });
}

// 使用示例
waitForElementWithTimeout('.target-element', 5000)
  .then(element => {
    // 找到目标元素后的操作
    console.log('Element found:', element);
  })
  .catch(error => {
    // 超时或找不到目标元素的处理
    console.error(error);
  });

function waitForElementWithTimeout(selector, timeout) {
  return new Promise((resolve, reject) => {
    const startTime = Date.now();
    
    const observer = new MutationObserver(mutations => {
      const element = document.querySelector(selector);
      
      if (element) {
        observer.disconnect();
        resolve(element);
      } else if (Date.now() - startTime >= timeout) {
        observer.disconnect();
        reject(new Error(`Timeout exceeded while waiting for element ${selector}`));
      }
    });
    
    observer.observe(document.documentElement, { childList: true, subtree: true });
  });
}

// 使用示例
waitForElementWithTimeout('.target-element', 5000)
  .then(element => {
    // 找到目标元素后的操作
    console.log('Element found:', element);
  })
  .catch(error => {
    // 超时或找不到目标元素的处理
    console.error(error);
  });