Seb's leetcode

# 题目描述

请补全JavaScript代码，要求根据参数动态生成"li"标签页码并插入"ul"标签下。要求如下：

  1. "allItem"为总数据项个数，"pageItem"为每页的数据项个数
  2. "li"标签内容为当前页码数，页码从1开始

# 测试用例

  • 输入：_createPage(13,2)
  • 输出："li"长度为7，"li"内容依次为"1","2","3","4","5","6","7"

# 思路

使用文档片段,最后再统一添加到ul上.

DocumentFragments是DOM节点。它们不是主DOM树的一部分。通常的用法是创建文档片段，将元素附加到文档片段，然后将文档片段附加到DOM树。在DOM树中，文档片段被其所有的子元素所代替。因为文档片段存在于内存中，并不在DOM树中，所以将子元素插入到文档片段时不会引起页面回流（对元素位置和几何上的计算）。因此，使用文档片段通常会带来更好的性能

# 代码实现

<!DOCTYPE html>
<html>
    <head>
        <meta charset=utf-8>
    </head>
    <body>
    	<ul id="ul">
            
        </ul>
        <script type="text/javascript">
            const _createPage = (allItem, pageItem) => {
                // 补全代码
                let ul = document.getElementById("ul");
                const frag = document.createDocumentFragment();
                let cnt = Math.ceil(allItem / pageItem);
                for(let i = 1; i <= cnt; i ++){
                    let li = document.createElement("li");
                    li.innerText = `${i}`;
                    frag.appendChild(li);
                } 
                ul.appendChild(frag);
            }
        </script>
    </body>
</html>

  
        Copied!
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25