Question

如何等到页面上的某些文字出现？我正在使用它，但它不起作用：

function waitText() {
    if (document.getElementsByTagName('p')[0].innerHTML == "Some Text"){
        alert("text appears");
    }else{
        setTimeout(function() { waitText() }, 1000);
}
}

Answer 1

您的代码存在一些问题，

首先，我们不想重复设置间隔 - 这会导致级联并最终冻结线程并不好玩
其次， getElementByTagName 不是document上的方法。您必须索引0结果的项document.getElementsByTagName，或使用其他查找，例如document.querySelector

所以你可以这样做的一个例子是

function waitForText(element, text, callback, freq) {
    if (!element || !callback || typeof text !== 'string')
        throw new TypeError('Bad value');
    var interval = window.setInterval(test, freq || 200);
    function test() {
        if (!element.parentNode) // node detached, don't hold onto this
            window.clearInterval(interval);
        if (element.textContent === text) {
            window.clearInterval(interval);
            callback.call(element);
        }
    }
}

然后

// say you want the first <p> in the DOM tree
var elm = document.querySelector('p');
// attach the condition
waitForText(elm, 'some text', () => console.log('Text appears'));

将来......

window.setTimeout(() => elm.textContent = 'some text', 6e3);
// wait 6 seconds..
// callback fires

Answer 2

如果您不需要支持旧浏览器，我会使用MutationObserver代替脏检查。

var target = document.querySelector('p');

// create an observer instance
var observer = new MutationObserver(function(mutations) {
  mutations.forEach(function(mutation) {
     [].every.call(mutation.addedNodes, function(node) { 
       if (node.nodeType === 3 && node.textContent === text) { // optionally you can remove nodeType checking if you pass the text inside some element like div etc.
         console.log("text appeared");
         observer.disconnect();
         return false;
       }
       return true;
     });
  });   
});
observer.observe(target, { childList: true });

Javascript等到文字出现

2 个答案: