Question

我有HTML，例如：

<div class="mt brn">
  <a href="....">Country 1</a>
</div>
<div class="mt brn">
  <a href="....">Capital 1</a>
</div>
<div class="mt brn">
  <a href="....">Population</a>
</div>

我想知道如何使用Javascript（而不是jquery）来创建数组：

[国家1，资本1，人口]

我知道每个href之上的DIV类将被设置为＆＃34; mt brn＆＃34; - 所以我希望忽略任何不包含在

中的href文本

提前致谢，

标记

Answer 1

使用document.querySelectorAll('.mt.brn a');在类.mt.brn中获取锚标记。然后循环遍历元素并使用inneHTML获取内容。或使用textContent获取文本

＆＃13;

var elemts = document.querySelectorAll('.mt.brn a');
var textArray=[];
for(var i= 0;i< elemts.length;i++){

  textArray.push(elemts[i].innerHTML )
}
console.log(textArray)

＆＃13;

<div class="mt brn">
  <a href="....">Country 1</a>
</div>
<div class="mt brn">
  <a href="....">Capital 1</a>
</div>
<div class="mt brn">
  <a href="....">Population</a>
</div>

＆＃13;

使用文字内容的示例：

＆＃13;

var elemts = document.querySelectorAll('.mt.brn a');
var textArray=[];
for(var i= 0;i< elemts.length;i++){

  textArray.push(elemts[i].textContent )
}
console.log(textArray)

＆＃13;

<div class="mt brn">
  <a href="....">Country 1</a>
</div>
<div class="mt brn">
  <a href="....">Capital 1</a>
</div>
<div class="mt brn">
  <a href="....">Population</a>
</div>

＆＃13;

Answer 2

使用document.querySelectorAll：

var anchorElements = document.querySelectorAll('.mt.brn > a');
var contents = [];
for (var i = 0; i < anchorElements.length; i++) {
  contents.push(anchorElements[i].textContent);
}

console.log(contents);

<div class="mt brn">
  <a href="....">Country 1</a>
</div>
<div class="mt brn">
  <a href="....">Capital 1</a>
</div>
<div class="mt brn">
  <a href="....">Population</a>
</div>

Answer 3

您可以尝试以下javascript代码：

var divList = document.getElementsByClassName("brn"); 
var tab=[]; 
for (index = 0; index < divList.length; ++index)  { 
    var text =divList[index].getElementsByTagName('a')[0].innerHTML;
    tab.push(text);
}

如何选择div和href中的所有文本

3 个答案: