Javascript 仅当具有特定id的元素可用时才执行函数

我有一个JavaScript函数，只有当某个id的元素在DOM中可用时，才应该执行该函数。

好吧，如果我正确理解您的需求，我相信这应该是可行的：

const elementToObserve = document.querySelector("#parentElement");
const lookingFor = '#someID';
const observer = new MutationObserver(() => {
    if (document.querySelector(lookingFor)) {
        console.log(`${lookingFor} is ready`);
        observer.disconnect();
    }
});

observer.observe(elementToObserve, {subtree: true, childList: true});

---

您将希望观察元素出现位置的父元素。当

子树

和

子列表

选项设置为true时，它将观察其中的更改，并在发现任何差异时触发回调。如果要查找的元素现在在页面上，则可以签入该回调。

遵循文档生成一个工作示例是非常重要的，并且可以提供有用的说明

事实证明，这不是一个“对象类型”，而是一个接口描述语言（IDL）术语，用于描述用于观察更改的选项对象—只需要一个对象

FWIW这里是一个检测添加新节点的示例，或者将现有节点的id更改为“certainId”

“严格使用”；
const target=document.getElementById（“目标”）；
const observer=新的变异观察者（checkChanges）；
const certainId=“certainId”；
功能检查更改（更改列表，来自观察者）{
log（“回调第二个参数是观察者对象：%s”，fromObserver==observer）；
对于（让更改列表更改）{
如果（change.type==“属性”）{
if（change.target.id==certainId）{
log（“id已更改：”，change.target）；
打破
}
}
else if（change.type==“childList”）{
for（让更改节点。添加节点）{
if（node.id==certainId）{
log（“添加了目标：”，节点）；
打破
}
}     
}
}
}
观察者，观察（目标{
子树：对，
attributeFilter:[“id”]，
儿童名单：对
});
//试验
函数changeId（）{
if（document.getElementById（“test1”））{
test1.id=“certainId”；
}
}
函数insertSpan（）{//按钮单击
if（document.getElementById（“test2”））{
test2.innerHTML='span#certainId'；
}    
}

分区测试1（最初）
分区测试2
设置id值或
插入新元素

到目前为止您尝试了什么，但没有成功？没有，我完全不知道从哪里开始。你有没有看过MutationObserver API？有一些烧了一半的古梵文手稿比这更清晰。选择是使用MutationObserver或setInterval来持续检查元素