检查页面中是否存在数组中的项目。如果是，请提醒它。如果没有，请刷新页面

Question

所以，我有这个用户脚本会在页面内查找字符串。如果找不到，则会在4秒后刷新页面：

var item = 'apple';
if(document.body.innerHTML.toString().indexOf(item) > -1){
    setTimeout(function() {
        alert(item + " was found");
    }, 150);
}else{
    setTimeout(function()
               {
        location.reload(true);
    }, 4000);
}

这段代码完美无缺。但后来，我想用一个数组搜索多个项目：

var item = [
    'apple',
    'peach'
];
for (var i = 0; i < item.length; i++){
    if(document.body.innerHTML.toString().indexOf(item[i]) > -1){
        player.play();
        setTimeout(function() {
            var curitem = item[i];
            alert(item[i] + " was found");
        }, 200);
    }
}
//else{
//    setTimeout(function()
//               {
//        location.reload(true);
//    }, 4000);
//}

但我被卡住了，我不知道：

1. 如何提醒找到的数组项？它现在的方式，它警告'未定义被发现'。 这意味着脚本正在运行，它正在查找数组中的项目。但在警报显示为“未定义”。
2. 如果没有找到任何内容，如何刷新页面？

Answer 1

有几种方法可以做到这一点。我更喜欢正则表达式，因为它提供更大的功率，并且通常比循环更快，对于大量术语。

代码如：

var items = [
    'apple',
    'peach'
];
var itmRegEx = new RegExp (`(${ items.join("|") })`);

var itmMtch  = document.body.innerHTML.match (itmRegEx);
if (itmMtch  &&  itmMtch.length) {
    //player.play();
    //setTimeout (alert, 200, itmMtch[1] + " was found");
    setTimeout (console.log, 200, itmMtch[1] + " was found");
}
else {
    console.log ("Reloading...");
    //setTimeout ( () => {location.reload (true);}, 4000);
}

注意：

1. toString()是不必要的。
2. 这允许正则表达式的全部功能。例如，像'apple\\b'这样的表达式 - 匹配“apple”，但不匹配“apples”。
3. 当心使用innerHTML。这将匹配像 <a href="virusserver.net/badapple">free!</a>。 如果您想要的内容在页面上显而易见，请改用textContent。
4. 请注意setTimeout()的现代形式。
5. document.body投出一个宽而缓慢的网。如果可以，请按类或ID定位您感兴趣的节点。
6. location.reload是一个特殊情况，其中setTimeout()的参数化版本将不起作用。 （它给出了“非法调用”错误。）

Answer 2

这将在数​​组中找到第一个匹配项。此处使用Div id content，因为脚本是示例代码段中正文的一部分。

var item = [
    'apple',
    'peach'
];

//make sure that items dont contain special regex chars
var itemRe = new RegExp(item.join("|"));
var result = document.getElementById("content").innerHTML.toString().match(itemRe);

if (result) {
  //player.play();
  setTimeout(function() {
    alert(result.toString() + " was found");
  }, 200);
} else {
  setTimeout(function() {
    location.reload(true);
  }, 4000);
}

<div id="content">gfg</div>