这两个承诺与我期望发生的事情之间的区别

Question

我有两个承诺，在等待 A( 元素出现或 B( 元素消失时被调用

* Wait for DOM element to Disappear
* @param {String} element DOM element to be watched
*/
export const elementVisibilityWatcherDisappear = ClientFunction((element) => {
return new Promise(resolve => {
var interval = setInterval(() => {
if (document.querySelector(element)){
return;
}
clearInterval(interval);
resolve();
}, 100);
});
})
/**
* Wait for DOM element to Appear
* @param {String} element DOM element to be watched
*/
export const elementVisibilityWatcherAppear = ClientFunction((element) => {
return new Promise(resolve => {
var interval = setInterval(() => {
if (!document.querySelector(element)){
return;
}
clearInterval(interval);
resolve();
}, 100);
});
})

document.querySelector(element)返回什么？ 如果在 DOM 中找不到该元素，它不会返回null吗？ 因此，对于 IF 语句中的方法"elementVisibilityWatcherDisappear"，当 querySelector 返回 true 时，它不会返回 'true' 吗，从而解析了承诺......

然而，这与我所看到的相反。 调用 disappear 方法时，当元素不再是 dom 的一部分时，该方法实际上会返回......我只是 100% 困惑为什么它会 b/c if 语句逻辑表明它不会......

Answer 1

return语句发生在给定setInterval的函数内，它不是elementVisibilityWatcherAppear函数的直接组成部分。如果提供给setInterval的函数返回，则在再次调用该函数之前不会发生任何异常情况。有趣的部分发生在另一种情况下：然后函数停止被调用，承诺返回resolve().

顺便说一下，你可能对使用MutationObserver感兴趣。