Question

我正在将DOM元素的innerHTML中的内容与静态文本数组中的内容进行比较。元素中的内容始终与文本数组中的条目匹配。

<p id="main1">b</p>

var textArr = ["<p>a</p>","<p>b</p>","<p>c</p>"];
if (main1.innerHTML == textArr[0]) {
            return 0;
        } else if (main1.innerHTML == textArr[1]) {
            return 1;
        } else if (main1.innerHTML == textArr[2]) {
            return 2;
        } else if (main1.innerHTML == textArr[3]) {
            return 3;
        } else {
            return 0;
}
//returns 1

我很快将添加条目到textArr，并且意识到对于这种情况，通常来说for循环是更好的做法。但是，我的条件语句永远不会碰到循环。

var index;
for (index = 0; index < textArr.length; ++index) {
    if (main1.innerHtml == textArr[index]) {
        return index;
    } 
}
//does nothing

如何对照数组中的内容检查元素中的内容？

Answer 1

只需像这样使用Array.prototype.indexOf()：

return textArr.indexOf(main1.textContent);

这将从数组和main1元素中返回匹配文本的索引。

Answer 2

你快到了。

var main = document.getElementById("main1").innerHTML;
var textArr = ["a", "b", "c"]


function check(value, array) {

  for (i = 0; i < textArr.length; i++) {
    if (value == array[i]) {
         return value + " is equal to " + array[i]
  } 
 }
}

document.write(check(main, textArr))
document.write("</br>" + check("a", textArr))
document.write("</br>" + check("h", textArr))

<p id="main1" style="display: none">b</p>

Answer 3

尝试以下Array.prototype.find()：

var found = textArr.find(function(element) { 
  return main1.textContent == element;
});

它将返回匹配元素的内容。

Answer 4

正如我在评论中所说，如果您仅仅想要相关HTML元素的文本内容，使用```innerHtml``可能是个坏主意。如果您还需要嵌套标记，那么可以肯定，这根本不是问题，只需小心使用哪个标记，有时您将希望将嵌套HTML元素作为一部分返回字符串，其他时候则不会，等等。

const textArr = ["a", "b", "c"];
const el = document.getElementById("main1");
const getIndex = () => textArr.indexOf(el.textContent);

console.log(getIndex());

<p id="main1">b</p>

Answer 5

main1未定义。我只是将innerHTML设置为变量，然后进行比较。

var arr = ["a", "b", "c", "d"];
var answer = document.getElementById("main1").innerHTML;
var index;
for (index = 0; index < arr.length; index++) {
    if (answer == arr[index]) {
        return index;
    } 
}

循环比较dom元素文本到数组的javascript

5 个答案: