首页 > 试题广场 >

生成页码

[编程题]生成页码
  • 热度指数:15064 时间限制:C/C++ 3秒,其他语言6秒 空间限制:C/C++ 256M,其他语言512M
  • 算法知识视频讲解
请补全JavaScript代码,要求根据参数动态生成"li"标签页码并插入"ul"标签下。要求如下:
1. "allItem"为总数据项个数,"pageItem"为每页的数据项个数
2. "li"标签内容为当前页码数,页码从1开始
示例1

输入

_createPage(13,2)

输出

"li"长度为7,"li"内容依次为"1","2","3","4","5","6","7"
        const _createPage = (allItem, pageItem) => {
            // 补全代码
            let pageSize = Math.ceil(allItem / pageItem)
            let ul = document.querySelector('ul')
            for(let i = 0; i < pageSize; i++) {
              let li = document.createElement('li')
              li.innerHTML = i+1
              ul.appendChild(li)
            }
        }
发表于 2022-01-11 18:25:46 回复(0)
        <script type="text/javascript">
            const _createPage = (allItem, pageItem) => {
                // 补全代码
                // 1.获取ul的DOM元素
                var ul = document.getElementById('ul');
                // 2.li的长度(页数)
                var pageLen = Math.ceil(allItem/pageItem);
                var content = '';
                // 3.为li标签内容赋值
                for (var i = 1;i < pageLen+1;i++) {
                    content += `<li>${i}</li>`;
                }
                ul.innerHTML = content;                
            }
        </script>

发表于 2022-03-20 22:31:01 回复(0)
不用频繁操作DOM
const _createPage = (allItem, pageItem) => {
                // 补全代码
                const pages=Math.ceil(allItem/pageItem)
                let seg=document.createDocumentFragment()
                for(let i=1;i<=pages;i++){
                    const li=document.createElement("li")
                    li.innerText=i
                    seg.append(li)
                }
                ul.appendChild(seg)
            }

发表于 2023-06-20 19:58:28 回复(0)
        let number = Math.ceil(allItem / pageItem);
        let ul = document.querySelector('#ul');
        let str = '';
        for (let i = 0; i < number; i++) {
          str += `<li> ${i + 1} </li>`;
        }
        ul.innerHTML = str;

发表于 2022-12-25 16:10:01 回复(0)
<!DOCTYPE html>
<html>
    <head>
        <meta charset=utf-8>
    </head>
    <body>
        <ul id="ul">
            
        </ul>
        <script type="text/javascript">
            const _createPage = (allItem, pageItem) => {
                // 补全代码
                var ulEle = document.getElementById("ul");
                var page = Math.ceil(allItem/pageItem);
                
                for(let i = 0;i<page;i++){
                    let li = document.createElement("li");
                    li.innerText=i+1;
                    ulEle.append(li)
                }
            }
        </script>
    </body>
</html>
发表于 2021-12-21 17:21:06 回复(0)
 const _createPage = (allItem, pageItem) => {
     // 补全代码
     //获取长度 ceil是向上取整
     let length = Math.ceil(allItem / pageItem);
     //生成一个指定长度的数组
     let arr = Array(length).fill(1);
     //reduce生成li字符串
     document.getElementById('ul').innerHTML = arr.reduce((pre, cur, index) => {
         return `${pre}<li>${index+1}</li>`;
     }, '');
 }

发表于 2024-03-26 03:56:56 回复(0)
const _createPage = (allItem, pageItem) => {
    // 补全代码
    const ulElement = document.querySelector("#ul")
    const pageNum = Math.ceil(allItem/pageItem)
    for(let i =1;i<pageNum+1;i++){
        let liElement = document.createElement("li")
        liElement.textContent = i;
        ulElement.appendChild(liElement)
    }
}

编辑于 2023-12-27 10:11:20 回复(0)
 const _createPage = (allItem, pageItem) => {
                // 补全代码
                let count = Math.ceil(allItem/pageItem)
                //console.log(count)
                let ul = document.querySelector('#ul')
                for(let i =0;i<count;i++){
                    ul.innerHTML+= `<li>${i+1}</li>`
                }
                return ul
            }
编辑于 2023-12-04 15:41:52 回复(0)
     let u = document.getElementById('ul')
        
            const _createPage = (allItem, pageItem) => {
                // 补全代码
                   for (let i = 1; i <= Math.ceil(allItem / pageItem); i++) {
                    let li = document.createElement('li')
                    li.innerText = i
                    u.appendChild(li)
                  }
                
            }

发表于 2023-09-02 16:29:45 回复(0)
const _createPage = (allItem, pageItem) => {
                // 补全代码
                const num = allItem % pageItem
                if(num === 0) {
                    sum(allItem / pageItem)
                }else {
                    sum((allItem+1) / pageItem)
                }
                ul.innerHTML = `<li>${liDom.join(',')}</li>`
            }

            function sum(data) {
                console.log(data)
                    for(let i = 1; i <= data; i++) {
                        liDom.push(i)
                    }
            }
一直说我错误,我不理解,望解惑,效果都出来了

发表于 2023-07-22 16:22:02 回复(0)
const _createPage = (allItem, pageItem) => {
                // 补全代码
                total=Math.ceil(allItem/pageItem)
                ul=document.querySelector("#ul")
                for(i=1;i<total+1;i++){
                  ul.innerHTML+='<li>'+`${i}`+'</li>'
                }
               
            }
发表于 2023-03-15 16:48:30 回复(0)
const _createPage = (allItem, pageItem) => {
                // 补全代码
                let res = Math.ceil(allItem/pageItem)
                for(let i=1;i<=res;i++){
                    document.getElementById("ul").innerHTML += `<li>${i}</li>`
                }
            }

发表于 2023-02-22 22:03:32 回复(0)
let pageSize = Math.ceil(allItem/pageItem)
let ul = document.querySelector('#ul')
let str = ''
for(let i = 0; i < pageSize; i++) {
    str += `<li>${i+1}</li>`
}
ul.innerHTML = str

发表于 2023-02-22 21:41:57 回复(0)
        <script type="text/javascript">
            const _createPage = (allItem, pageItem) => {
            // 补全代码
            let ul = document.querySelector("#ul");
            let pages = Math.ceil(allItem / pageItem);
            for (let i = 1; i <= pages; i++) {
              let li = document.createElement("li");
              let str =  i
              li.innerHTML = str;
              ul.append(li);
            }
          };
        </script>

发表于 2023-02-14 01:48:18 回复(0)
<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8" />
  </head>
  <body>
    <ul id="ul"></ul>
    <script type="text/javascript">
      const _createPage = (allItem, pageItem) => {
        // 补全代码
        const ul = document.getElementById("ul");
        const num = Math.ceil(allItem / pageItem);
        let str = "";
        for (let i = 1; i <= num; i++) {
          str += `<li>${i}</li>`;
        }
        ul.innerHTML = str
      };
    </script>
  </body>
</html>

发表于 2022-12-11 18:03:57 回复(0)
let ul = document.querySelector('#ul')
let pages = allItem / pageItem;
let i = 0;
let str = '';
while(i++ < pages) {
    str += `<li>${i}</li>`
}
ul.innerHTML = str

发表于 2022-12-03 19:21:28 回复(0)
<script type="text/javascript">
            const _createPage = (allItem, pageItem) => {
                // 补全代码
                var ul = document.querySelector('#ul')
                var pages = Math.ceil(allItem/pageItem)
                 for(let i = 1;i<pages+1;i++){
                     var li = document.createElement('li')
                     li.innerHTML = i
                      ul.appendChild(li)
                 }
                
            }
        </script>
发表于 2022-10-03 00:23:59 回复(0)
// 补全代码
      let pagenum=Math.ceil(allItem / pageItem)
      let ul=document.querySelector('#ul')
      for(let i=0;i<pagenum;i++){
        let a=document.createElement('li')
        a.innerText=i+1
        ul.appendChild(a)
      }

发表于 2022-09-25 14:41:37 回复(0)
发表于 2022-08-25 16:45:07 回复(0)
        const _createPage = (allItem, pageItem) => {
            // 补全代码
            // 获取ul元素
            let ul = document.getElementById("ul");
            // 计算所需的页数
            const pageNum = Math.ceil(allItem / pageItem);
            // 循环为<li></li>标签赋值
            let inner = "";
            for (let i = 1; i <= pageNum; i++) {
                inner += `<li>${i}</li>`;
            }
            // 修改ul内容
            ul.innerHTML = inner;
        }
发表于 2022-08-25 15:11:14 回复(0)

问题信息

难度:
32条回答 772浏览

热门推荐

通过挑战的用户

查看代码