我是编码和编程新手，
我已经尝试获取要在页面上显示的幻灯片的控制编号，但我仍然收到此错误消息：
script.js：48未捕获类型错误：无法在加载（script.js：23）时在开始（script.js：48）时读取null的属性'appendChild'在script.js：51开始@ script.js：48加载@脚本.js:23（匿名）@ script.js:51"
有人能告诉我为什么会发生这种情况吗？我的代码如下。
const controls = document.querySelector(".controls");
const container = document.querySelector(".thumbnailcontainer");
const allBox = container.children;
const containerWidth = container.offsetWidth;
const margin = 30;
var item = 0;
var totalItems = 0;
// item setup per slide
responsive =
[ { breakPoint: { width: 0, item: 1 }} // if width greater than 0 (1 will item show)
, { breakPoint: { width: 600, item: 2 }} // if width greater than 600 (2 will item show)
, { breakPoint: { width: 1000, item: 6 }} // if width greater than 1000 (4 will item show)
]
function load() {
for (let i = 0; i < responsive.length; i++) {
if (window.innerWidth > responsive[i].breakPoint.width) {
items = responsive[i].breakPoint.item
}
}
start();
}
function start() {
var totalItemsWidth = 0
for (let i = 0; i < allBox.length; i++) {
//width and margin setup of items
allBox[i].style.width = (containerWidth / items) - margin + "px";
allBox[i].style.margin = (margin / 2) + "px";
totalItemsWidth += containerWidth / items;
totalItems++;
}
//tumbnail-container width set up
container.style.width = totalItemsWidth + "px";
//slides controls number set up
const allSlides = Math.ceil(totalItems / items);
const ul = document.createElement("ul");
for (let i = 1; i <= allSlides; i++) {
const li = document.createElement("li");
li.id = i;
li.innerHTML = i;
li.setAttribute("onclick", "controlSlides(this)");
ul.appendChild(li);
}
controls.appendChild(ul);
}
window.onload = load();
幕布斯7119047
相关分类