动态读取div的所有跨度

Question

我有一个div里面，我有多个跨度。 现在我想阅读所有跨度的所有文本以及thrir id并将其填充到javascript地图中，其中key = spanid和value =“span of text.How我能做到吗？

Eg <div mydiv="xyx" >   
     <span id ="sp1" > M/span>
     <span id ="sp2" > M/span>
     .... 
      ..

   </div>

我如何填充地图？

Answer 1

您可以使用document.getElementById和document.getElementsByTagName获取元素，然后遍历它们并将它们添加到对象中。 使用textContent和innerText获取span元素的文本，并将它们插入到对象中，如下所示：

var spans = document.getElementById('xyx').getElementsByTagName('span'), 
    obj = {};

for(var i = 0, l = spans.length; i < l; i++){
    obj[spans[i].id] = spans[i].textContent || spans[i].innerText;
}

看到它在这里工作： http ： //www.jsfiddle.net/SJs4h/

Answer 2

var container=document.getElementById('xyx');
var spanArray=container.getElementsByTagName('span');
for(var s=0;s<spanArray.length;s++){
  spanText=spanArray[s].innerHTML;
}

Answer 3

使用Jquery非常简单：

var spans = $('#xyx').find('span');
var arr = new Array();
 foreach(spans as span)
 {
       arr[$(span).attr('id')] = $(span).text;
 } 

希望我帮忙。

更新：无jquery方式：

var spans = document.getElementById('xyx');
spans = spans.getElementsByTagName('span');
var arr = new Array();
foreach(spans as span) 
{
   arr[span.getAttribute('id')] = arr[span.innerHTML];
}