javascript - 在 DOM 元素内部选择

Question

这是html代码

<div class="extra-sub-block sub-block-experience">
    <h6 style="display:inline;" id="exp-pos-0" class="extra-sub-block-head sub-block-head-experience">CEO</h6>
</div>
<div class="extra-sub-block sub-block-experience">
    <h6 style="display:inline;" id="exp-pos-1" class="extra-sub-block-head sub-block-head-experience">COO</h6>
</div>

这样类似的结构还有好几个。现在我尝试从每个 block 中提取值。

var temp=document.getElementsByClassName('sub-block-experience');
var result=$(temp[0]+"#exp-pos-0");

这会引发错误。我关注了selecting element inside another DOM

我也尝试过

var temp=document.getElementsByClassName('sub-block-experience');
var result=temp[0].find('h6');

这也不太有效。我在这里做错了什么。帮忙？

Answer 1

要从所有 block 中提取值，您可以使用 .map()功能如下:

var results = $('.extra-sub-block-head').map(function(){
  return $(this).text();
})

Demo

旁注:由于id在文档中是唯一的，因此您可以使用id选择器直接访问元素，例如var result = $("#exp-pos-0");而不是 var result=$(temp[0]+"#exp-pos-0");