从ul li div获取数据并存储到json中

时间:2016-08-07 11:19:06

标签: javascript arrays json console.log nightwatch.js

我在过去几个小时内已经考虑过这个问题,但却找不到任何解决方案。所以基本上我有一个像这样的列表

<ul class="list"> 
     <li class="user">
         <div class="name">Name</div>
         <div class="surname">Surname</div>
     </li>
     <li class="user odd">
         <div class="name">Name</div>
         <div class="surname">Surname</div>
     </li>
     <li class="user">
         <div class="name">Name</div>
         <div class="surname">Surname</div>
     </li>
     <!--And like so....-->
</ul>

这就是我的守夜人脚本的样子

 .elements('css selector','.li',function(result){
    console.log(result.value);
  });

结果是[] =空数组

但主要问题是如何在ul li div中执行所有数据并像json文件一样编写console.log是最佳做法?

喜欢:

{
    "name": "name",
    "surname": "Yaya",
}, 
{
    "name": "name2",
    "surname": "Yaya2",
}, 

如果你们中的任何一方可以提供帮助,请给我一些帮助。

1 个答案:

答案 0 :(得分:0)

您可以在纯JS中执行以下操作。

var lis = document.querySelectorAll("ul li"),
      i = 0,
  jData = [];
for (var li of lis) {
  var divs = li.getElementsByTagName("div"),
     liObj = {};
  for (var div of divs) liObj[div.className] = div.textContent;
  jData.push(liObj);
}
jData = JSON.stringify(jData);
console.log(jData);
  <ul class="list">
    <li class="user">
      <div class="name">Name</div>
      <div class="surname">Surname</div>
    </li>
    <li class="user odd">
      <div class="name">Name</div>
      <div class="surname">Surname</div>
    </li>
    <li class="user">
      <div class="name">Name</div>
      <div class="surname">Surname</div>
    </li>
  </ul>