如何让孩子们元素

Question

我有以下的HTML，我想验证：

<div class="project-counts-nav-wrapper" style=""> 
    <ul id="project-counts" class="project-counts-nav" style=""> 
     <li style="">0 active projects</li> 
     <li style="">0 draft projects</li> 
     <li style=""> 
     0 archived projects (
     <a href="/projects_archived">View</a> 
     ) 
     </li> 
    </ul> 
</div> 

如何获得文本值的每个“礼”标签元素？

我有以下实习生的js代码：

  .findByCssSelector('#project-counts') 
      .findAllByTagName('li') 
       .then(function(children){ 
       console.info('Show children length: ' + children.length); 
       console.info('children: ' + children); 
       for(var i=0; i<3; i++){ 
        // how do I get text for each element 
        console.info('Show children: ' + children[i]; 
       } 

       }).end(); 

我看到输出如下：

Show children length: 3 
children: [object Object],[object Object],[object Object] 
Show children: [object Object] 
Show children: [object Object] 
Show children: [object Object] 

我想获得：

0 active projects 
0 draft projects 
0 archived projects 

谢谢， 布拉德

Answer 1

这是解决方案。我加入了findAllByTagName命令后链接命令getVisableText：

  .findByCssSelector('#project-counts') 
      .findAllByTagName('li') 
      .getVisibleText() 
       .then(function(children){ 
       console.info('Show children length: ' + children.length); 
       console.info('children: ' + children); 
       for(var i=0; i < children.length; i++){ 
        console.info('Show each child: ' + children[i]); 
       } 

       }).end(); 

Answer 2

以下内容应该适用于您： -

var liElements = document.getElementsByTagName('li'), 
i; 
for (i = 0; i < liElements.length; i++) { 
    console.info(liElements[i].textContent); 
} 

上述内容应根据需要打印文本内容。注意 - 你想要继续并在你的li上放入类名，并使用它来获取元素，这样你就不会把页面上的所有元素都拉出来。

Codepen link