(function () { let fragment = document.createDocumentFragment(); // 获取地址栏信息 let GetQueryString = (name) => { let reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)"); let r = window.location.search.substr(1).match(reg); if (r != null) return unescape(r[2]); return ""; } let temp = GetQueryString('m') // 获取总数组 const arrAll = [] for (let k in objInfo) { arrAll.push({ id: k, name: objInfo[k] }) } // 开启了分页得到的数组 let arr = [] // 总数组分割 let arrSpile = [] if (pageOpen) { // 数据的总数 const total = arrAll.length // 计算出分页的个数 const pageSize = Math.ceil(total / pageNum) // 生成 分页 指示器 const body = document.querySelector('body') const pageBox = document.createElement('div'); pageBox.classList.add('pageBox') for (let i = 0; i < pageSize; i++) { const pageBoxSon = document.createElement('div'); pageBoxSon.innerHTML = i + 1 pageBox.appendChild(pageBoxSon) // 当前的裁剪数据-联合数组类型 arrSpile.push(arrAll.slice(i * pageNum, (i + 1) * pageNum)) } body.appendChild(pageBox) // 为分页绑定点击事件 const pageDomSonAll = document.querySelectorAll('.pageBox div') pageDomSonAll.forEach((v, i) => { v.addEventListener('click', () => { pageDomCreateFu(i) }) }) } else arr = arrAll // 向页面创建元素 const pageDomCreateFu = (acNum) => { if (pageOpen) { arr = arrSpile[acNum] //高亮当前 const pageDomSonAll = document.querySelectorAll('.pageBox div') pageDomSonAll.forEach(v => { v.classList.remove('active') }) pageDomSonAll[acNum].classList.add('active') } let ul = document.querySelector('.con'); ul.innerHTML = '' arr.forEach(v => { let li = document.createElement('li'); let divWrap = document.createElement('div'); let a = document.createElement('a'); let div = document.createElement('div'); let p = document.createElement("p"); divWrap.classList.add('case'); a.classList.add('link-a'); // 判断地址栏有没有参数,有的话就跳Model2,没有logo if (temp) a.href = `Model2.html?m=${v.id}`; else a.href = `Model.html?m=${v.id}`; div.classList.add('card-img'); div.style = `background-image: url(images/${v.id}.jpg)`; p.innerHTML = v.name; a.appendChild(div); divWrap.appendChild(a); li.appendChild(divWrap); li.appendChild(p); fragment.appendChild(li); }) ul.appendChild(fragment); } pageDomCreateFu(0) })()