как получить текст от элемента детей?

Question

У меня есть элемент div с несколькими дочерними элементами span. Я хочу получить текст всех промежутков с пробелом между ними и сравнить этот текст со строкой. мой код здесь:

var text = "this is some text in div";
var div = document.getElementById("div");
var btn = document.getElementById("btn");
btn.addEventListener("click", function() {
  var divtext = "";
  for (i = 0; i < div.children.length; i++) {
    divtext += div.children[i].innerHTML + " ";
  }
  console.log(divtext.localeCompare(text))
})

<div id="div"><span>this</span><span>is</span><span>some</span><span>text</span><span>in</span><span>div</span></div>
<button id="btn">click</button>

когда я использую localeCompare для строки и div для внутреннего текста, результат должен быть 0, но это не так. в чем проблема?

Answer 1

Ваше сравнение не равно (0), потому что в конце divtext.

есть конечный пробел. Если вы назначаете текст из каждого <span> в массив, вы можно использовать метод Array.prototype.join для объединения значений с разделителем ' ', тем самым исключая конечный пробел.

var text = "this is some text in div";
var div = document.getElementById("div");
var btn = document.getElementById("btn");
btn.addEventListener("click", function() {
  var divtext = [];
  for (i = 0; i < div.children.length; i++) {
    divtext.push(div.children[i].innerHTML);
  }
  console.log(text.localeCompare(divtext.join(' ')));
})

<div id="div"><span>this</span><span>is</span><span>some</span><span>text</span><span>in</span><span>div</span></div>
<button id="btn">click</button>