返回父div中的所有标签

Question

我试图运行一些JavaScript（通过Google标签管理器），它将刮我的页面并返回特定父div中的所有标签。我的例子是如下：

<div class="class1"> 

<div class="subclass1"> 
<a href="url1">location1</a> 
</div> 

<div class="subclass2"> 
<a href="url2">location2</a> 
</div> 

<div class="subclass3"> 
<a href="url3">location3</a> 
</div> 

</div> 

我想知道的Javascript返回所有标签的字符串中使用以下格式[url1,url2,url3]

任何帮助将非常感激网址 。

Answer 1

您可以使用querySelectoAll选择所有目标锚点元素，并使用.map()将它们的href值提取到数组。

var tags = Array.from(document.querySelectorAll('.class1 a[href]')).map((el) => el.getAttribute('href')); 
 
snippet.log('tags: ' + tags); 
 

 
//for older browser support 
 
var tags = [].map.call(document.querySelectorAll('.class1 a[href]'), function(el) { 
 
    return el.getAttribute('href') 
 
}); 
 
snippet.log('tags 2: ' + tags);

<!-- Provides the `snippet` object, see http://meta.stackexchange.com/a/242144/134069 --> 
 
<script src="http://tjcrowder.github.io/simple-snippets-console/snippet.js"></script> 
 
<div class="class1"> 
 

 
    <div class="subclass1"> 
 
    <a href="url1">location1</a> 
 
    </div> 
 

 
    <div class="subclass2"> 
 
    <a href="url2">location2</a> 
 
    </div> 
 

 
    <div class="subclass3"> 
 
    <a href="url3">location3</a> 
 
    </div> 
 

 
</div>

Answer 2

Javascript代码

function callMe(){ 
var tags = []; 
var count = $(".class1").children().length; 
for(var i=0; i<count; i++){ 
    tags.push($('.class1').children().eq(i).find('a').attr('href'));  
} 
console.log(tags); 
} 

你可以看到Plunker Here