题解 | #列表内容排序再渲染#
列表内容排序再渲染
https://www.nowcoder.com/practice/2dffcb354a484995894655a5547b0b49
{"html":"<!DOCTYPE html>\n<html>\n\n<head>\n <meta charset=\"utf-8\" />\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1\">\n\n\n</head>\n\n<body>\n <ul id=\"myList\">\n <li id=\"item1\">项目 1</li>\n <li id=\"item3\">项目 3</li>\n <li id=\"item2\">项目 2</li>\n <li id=\"item4\">项目 4</li>\n </ul>\n\n <script>\n function sortAndReturnTextContent() {\n const items = document.getElementById('myList').children;\n const ele = [...items].sort((a,b)=>a.id.slice(4) - b.id.slice(4)).map(item=>`<li id=\"${item.id}\">${item.innerHTML}</li>`).join('')\n document.getElementById('myList').innerHTML = ele\n }\n sortAndReturnTextContent()\n </script>\n\n\n\n</body>\n\n</html>","css":"","js":""}