如何使用純 Javascript 從 Div 內的 Span 獲取文本值

Question

<div class="auc col-100 mgb-1">
  <span class="xtag" id="test1"><span>test1</span><a href="#" class="tagDel">x</a></span>
  <span class="xtag" id="test2"><span>test2</span><a href="#" class="tagDel">x</a></span>
</div>

我如何獲得 test1 和 test2

xtag.forEach(function(){
  var s=[];
  s.push(document.querySelector('.xtag span').innerText.toLowerCase())
});

我想檢查一下

s.indexOf(valcheck)

如果使用 Jquery 我可以使用 find(); 但是對於香草 javascript 仍然讓我感到困惑

Answer 1

您可以嘗試使用Document.querySelectorAll()和Array.prototype.map() ：

 var s = Array.from(document.querySelectorAll('.xtag span')); s = s.map(el => el.innerText.toLowerCase()); console.log(s); // ["test1", "test2"] console.log(s.indexOf('test1')); // 0 console.log(s.indexOf('test2')); // 1

 <div class="auc col-100 mgb-1"> <span class="xtag" id="test1"><span>test1</span><a href="#" class="tagDel">x</a></span> <span class="xtag" id="test2"><span>test2</span><a href="#" class="tagDel">x</a></span> </div>