时间戳

首页 > 解决方案 > 如何使用函数在正文标签的末尾添加？

javascript - 如何使用函数在正文标签的末尾添加？

问题描述

如何编写接收对象数组作为参数（如名称和年龄）的函数。该函数必须使用具有格式名称 age 的 html 列表添加到 body 标记的末尾。

<html>
    <head>
        <title>Ex2</title>
    </head>
    <body>
      <script>
          var body = document.querySelector('body');
          body.append('Name Age');
      </script>
    </body>
</html>

标签： javascripthtml

解决方案

您可以尝试以下代码段

function addList(arr) {
  var body = document.getElementsByTagName('body')[0];
  var ul = document.createElement('ul');
  for (var i = 0, n = arr.length; i < n; ++i) {
    var li = document.createElement('li');
    li.innerHTML = `${arr[i].name} ${arr[i].age}`;
    ul.append(li);
  }
  body.append(ul);
}

addList([
  { name: 'Nikhil', age: 27 },
  { name: 'Nik', age: 26 }
]);
<html>
  <body>
  </body>
</html>

推荐阅读