Поиск индекса в массиве на основе текста DIV

Question

У меня есть DIV, в котором есть текст:

<div id="x">
  divText
</div>

У меня есть «строка заголовка», подобная этой:

var headerRow = ["wrong","wrongAgain","divText"];

У меня также есть такой массив:

var theArray = [["blah","blah","0"]["notIt","blahblah","1"],["unrelated","dontLook","0"]];

Я хочу найти индекс в Array (2), основанный на тексте внутри div:

var theDiv = x.innerHTML;
for (i=0; i < headerRow.length; i++){
    if (headerRow[i] == theDiv){        <--never works
    if (headerRow[i] == x.innerHTML) {  <---never works
    if (headerRow[i] == "divText") {     <--works (i = 2)
}

Как найти индекс, основанный на innerHTML div /переменная (первые два случая выше)?Спасибо!

Answer 1

Вы используете innerHTML, где в качестве которого возвращается содержимое HTML-элемента, включая пробелы и новые строки. Вместо этого используйте innerText или используйте методы trim метод для innerHTML или textContent.

В вашем случаесравнение не удачно, потому что текст, который вы извлекаете с помощью innerHTML, содержит пробелы и символ новой строки.

Примечание. Если идентификатор элемента является действительным идентификатором, его можно использовать непосредственно как window.elementid или просто elementid , но рекомендуется использовать getElementByID

var x = document.getElementById('x')  
var theDiv = x.innerHTML.trim();
for (i=0; i < headerRow.length; i++){
    if (headerRow[i] == theDiv) {
              // your codes goes here
              console.log('works')
    }
}

или Вы можете использовать

var theDiv = x.innerText

или

var theDiv = x.textContent.trim()

Answer 2

<div id="x">
    divText
</div>


<script>
    
    var headerRow = ["wrong","wrongAgain","divText"];
    var theDiv = document.getElementById('x').innerHTML;
    console.log(theDiv);
    for (i=0; i < headerRow.length; i++){
        if (headerRow[i] == theDiv.trim()){
            console.log(headerRow.indexOf(headerRow[i]));
            console.log(i);
            
        }
        
    }
        
</script>

Ваш if, если сравнение не работает из-за лишних пробелов / новой строки во внутреннем HTML-тексте div.Таким образом, вам нужно обрезать строку перед сравнением с содержимым массива строк заголовка.Обратите внимание, что вы можете либо использовать метод indexOf для получения индекса соответствующего элемента, либо вы можете просто использовать текущее значение i, которое также будет соответствовать индексу этого элемента.Надеюсь, что это имеет смысл для вас.

Answer 3

Чтобы получить текст из div, вы должны сначала получить элемент по идентификатору

var theDiv = document.getElementById("x").innerHTML

https://developer.mozilla.org/en-US/docs/Web/API/Document/getElementById

Он будет работать с 1-м массивом, а 2-й вложенный массив может быть сплющен первым

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/flat