JavaScript 循环检查元素是否存在并显示浮动面板

JavaScript 循环检查元素是否存在并显示浮动面板

以下代码展示了如何使用 JavaScript 循环检查元素是否存在，并在元素出现且浮动面板未显示的情况下显示浮动面板。同时，如果浮动面板已显示或元素不存在，则停止循环检查。

修改后的代码如下：

let targetNode = document.getElementById('setting_sd_model_checkpoint');

let vet = setInterval(function() {
    if (targetNode && !document.getElementById('floating-div')) {
        console.log('AAA');
        showFloatingPanel();
    } else {
        clearInterval(vet);
    }
}, 2000);

解释:

1. 使用 setInterval 函数每隔 2 秒执行一次检查。
2. 检查 targetNode 元素是否存在，并且 floating-div 元素不存在。
3. 如果满足条件，则执行 showFloatingPanel() 函数显示浮动面板。
4. 如果 targetNode 元素不存在或 floating-div 元素已存在，则使用 clearInterval 函数停止循环检查。

优点:

• 保证浮动面板只在 targetNode 元素出现后显示一次。
• 避免浮动面板在已经显示后再次显示。

注意:

• 请确保 showFloatingPanel() 函数已定义。
• 可以根据实际情况调整循环检查的间隔时间。

希望这个例子可以帮助你更好地理解 JavaScript 中的循环检查和事件处理。