<!-- 
场景描述：
在一个 HTML 页面中，有一个无序列表（ul），其中包含了一些项目（li）。
每个项目都有一个文本内容和一个唯一的 ID。
你需要编写一个 JavaScript 函数来提取列表中所有项目的文本内容，
并将它们按照 ID 进行排序，然后将排序后的文本内容重新渲染回去。
 -->
 <!DOCTYPE html>
<html>

<head>
  <meta charset="utf-8" />
  <meta name="viewport" content="width=device-width, initial-scale=1">


</head>

<body>
  <ul id="myList">
    <li id="item1">项目 1</li>
    <li id="item3">项目 3</li>
    <li id="item2">项目 2</li>
    <li id="item4">项目 4</li>
  </ul>

  <script>
    function sortAndReturnTextContent() {
      const items = document.getElementById('myList').children;
      // 在此补全代码
      /*获取根据id从小到大的排序的数组*/
      const itemsArray = Array.from(items).sort((a,b)=>{
        return a.id > b.id ? 1 : -1 ;
      })  
      /*获取排序后的li的html元素数组*/
      const itemsHtmlArray = itemsArray.map((item)=>{
        return item.outerHTML;
      })
      /*将html数组转换成字符串重新渲染ul*/
      document.getElementById('myList').innerHTML = itemsHtmlArray.join('');
    }
    sortAndReturnTextContent()
  </script>


</body>

</html>