Question

（我的本地存储有此内容：）

键--- registerList

值---

[{
  "firstname": "lily",
  "lastname": "ong",
  "NRIC": "S1234567Z",
  "DOB": "2018-07-30",
  "owncontact": "12345678",
  "homecontact": "12345678",
  "email": "123@gmail.com",
  "blk": "123",
  "street": "12345",
  "houseno": "123",
  "postalcode": "123456",
  "preferredevent": "wcp"
}, {
  "firstname": "Mickey",
  "lastname": "Mouse",
  "NRIC": "S1234567Z",
  "DOB": "2018-08-29",
  "owncontact": "12345678",
  "homecontact": "12345678",
  "email": "345@gmail.com",
  "blk": "123",
  "street": "12345",
  "houseno": "123",
  "postalcode": "123456",
  "preferredevent": "cb"
}]

（并且我想在li的体内显示）：

<p id="title">List of users who has registered for the event:</p>
<br/><br/>
<ol>
    <li id="listofusers" ></li>
</ol>

Answer 1

您需要做的是将id放入OL对象。然后编写一个循环以解析该对象。在此示例中，我提取了localstorage值并将其放入clients变量中。您可以将其复制并粘贴到html页面中以查看其运行。

<ol id="listofusersusingindex">
</ol>
<ol id="listofusersusingin">
</ol>
    <script>
    var clients = [{
      "firstname": "lily",
      "lastname": "ong",
      "NRIC": "S1234567Z",
      "DOB": "2018-07-30",
      "owncontact": "12345678",
      "homecontact": "12345678",
      "email": "123@gmail.com",
      "blk": "123",
      "street": "12345",
      "houseno": "123",
      "postalcode": "123456",
      "preferredevent": "wcp"
    }, {
      "firstname": "Mickey",
      "lastname": "Mouse",
      "NRIC": "S1234567Z",
      "DOB": "2018-08-29",
      "owncontact": "12345678",
      "homecontact": "12345678",
      "email": "345@gmail.com",
      "blk": "123",
      "street": "12345",
      "houseno": "123",
      "postalcode": "123456",
      "preferredevent": "cb"
    }];

为了进行培训，我介绍了两种通过JavaScript并将数据获取到HTML的方法。

首先，您将注意到必须获取html元素。让我们用JavaScript做到这一点。其次，循环需要知道元素的数量以获取长度。然后遍历引用其属性的对象，并将（+ =）附加到HTML对象中。

    var listofusersusingindex = document.getElementById("listofusersusingindex");
    var count = clients.length;
    for(var i = 0; i < count; i++)
    {
        listofusersusingindex.innerHTML += "<li>" + clients[i].firstname + " " + clients[i].lastname + "</li>";
    }

    var listofusersusingin = document.getElementById("listofusersusingin");
    for(var item in clients)
    {
        listofusersusingin.innerHTML += "<li>" + clients[item].firstname + " " + clients[item].lastname + "</li>";
    }

    </script>

我有一组对象，但是如何分别显示它们

1 个答案: