javascript - Javascript：检索 li 中存在的标签内容

Question

我是 javascript 的新手，我没有得到以下问题的解决方案我的代码是：

<ul>
    <li>
        <label name = "mv"> Movie1 </label>
        <label name = "sn"> Song1 </label>
        <label name = "ac"> Actor1 </label>
    </li>
    <li>
        <label name = "mv"> Movie2 </label>
        <label name = "sn"> Song2 </label>
        <label name = "ac"> Actor2 </label>
    </li>
</ul>

我想在第一次迭代中检索movie1 song1 和actor1，下一次使用相同的方式。有人请帮忙。谢谢

Answer 1

简单的：

function getData(){
    var result=[];
    var lis=document.getElementsByTagName('li');
    for(var k=0;k<lis.length;k++){
        for(var j=0;j<lis[k].childNodes.length;j++){
            result[k][j]=lis[k].childNodes[j].innerHTML;
        }
    }
    return result;
}

它将返回一个数组，该数组的每个元素将是另一个数组，该数组的每个元素将是一个标签的值。例如，它可能会返回：

[
    [
        'Great Gatsby',
        'Counting Stars',
        'Lio Decaprio'
    ],
    [
        'Argo',
        'Bangarang',
        'Johnny Depp'
    ]
]

Answer 2

var labels=document.getElementsByTagName("label");
var set=labels.length/3;
var myAry=[];

for(var i=0;i<set;i++){
 var str="";
   for(var j=(i*3);j<(i+1)*3;j++){ 
       str+=labels[j].innerHTML;
   }

 myAry.push(str); // myAry[0]= movie1 song1 actor1, myAry[1]=movie1 song1 actor1
} 

http://jsfiddle.net/wsfFh/

Answer 3

工作演示

a=document.getElementsByTagName("ul");
console.log(a[0].childNodes[1].innerText);

这会给你你想要的。如果您想要第二个列表，请使用以下

console.log(a[0].childNodes[3].innerText);

编辑：不知何故 Firefox 不采用 .innerText 属性。另一种方法是使用

.textContent

跨浏览器兼容。在 IE、Chrome、FF 中测试

小提琴

Answer 4

使用 jQuery 更容易

$("li").each(function(){
    var text = "";
    $(this).children().each(function(){
        text += " " + $(this).text() 
    });
    console.log(text)
});