我试图更改数组中每个项目的“值”，但每次发生此错误时“无法设置未定义的属性‘innerHTML’”

Question

我正在尝试更改创建的元素上的值，并使工作更简单，我为它们提供了类，以便稍后可以轻松地将其内容更改为数组，但当我尝试时根本不起作用

    let div_section = document.createElement('div');

    for (i = 0; i < 2; i++) {

        let section_boxes = document.createElement('section');

        section_boxes +1;

        section_boxes.setAttribute('class','box');

        div_section.appendChild(section_boxes);

    

        let boxes_h2 = document.createElement('h2');

        boxes_h2 +1;

        boxes_h2.setAttribute('class','boxesTitle');

        section_boxes.appendChild(boxes_h2);

        let boxes_p = document.createElement('p');

        boxes_p +1;

        boxes_p.setAttribute('class','boxesP');

        section_boxes.appendChild(boxes_p); 

        

    };

    //Grabing classes

    let getBoxes = document.getElementsByClassName('box');

    let getTitle = document.getElementsByClassName('boxesTitle');

    let getText = document.getElementsByClassName('boxesP');

    

    //Don't know why doesn't work 

    getText[0].innerHTML = "Some Random text";

    getTitle[0].innerHTML = "Title";

    for(i = 0; i < getBoxes.length; i++){

        getBoxes[i].style.backgroundColor = "#947062";

    };

Answer 1

你忘了附加正文，这就是原因&nbsp; let div_section = document.createElement("div");&nbsp; for (i = 0; i < 2; i++) {&nbsp; &nbsp; let section_boxes = document.createElement("section");&nbsp; &nbsp; section_boxes + 1;&nbsp; &nbsp; section_boxes.setAttribute("class", "box");&nbsp; &nbsp; div_section.appendChild(section_boxes);&nbsp; &nbsp; let boxes_h2 = document.createElement("h2");&nbsp; &nbsp; boxes_h2 + 1;&nbsp; &nbsp; boxes_h2.setAttribute("class", "boxesTitle");&nbsp; &nbsp; section_boxes.appendChild(boxes_h2);&nbsp; &nbsp; let boxes_p = document.createElement("p");&nbsp; &nbsp; boxes_p + 1;&nbsp; &nbsp; boxes_p.setAttribute("class", "boxesP");&nbsp; &nbsp; section_boxes.appendChild(boxes_p);&nbsp; }&nbsp; // addedline of code added&nbsp; document.body.append(div_section);&nbsp; //Grabing classes&nbsp; let getBoxes = document.getElementsByClassName("box");&nbsp; let getTitle = document.getElementsByClassName("boxesTitle");&nbsp; let getText = document.getElementsByClassName("boxesP");&nbsp; //Don't know why doesn't work&nbsp; getText[0].innerHTML = "Some Random text";&nbsp; getTitle[0].innerHTML = "Title";&nbsp; for (i = 0; i < getBoxes.length; i++) {&nbsp; &nbsp; getBoxes[i].style.backgroundColor = "#947062";&nbsp; }

Answer 2

您不添加div_section到文档 DOM。let div_section = document.createElement('div');// This was missingdocument.body.appendChild(div_section);for (i = 0; i < 2; i++) {&nbsp; &nbsp; let section_boxes = document.createElement('section');&nbsp; &nbsp; section_boxes +1;&nbsp; &nbsp; section_boxes.setAttribute('class','box');&nbsp; &nbsp; div_section.appendChild(section_boxes);&nbsp; &nbsp; let boxes_h2 = document.createElement('h2');&nbsp; &nbsp; boxes_h2 +1;&nbsp; &nbsp; boxes_h2.setAttribute('class','boxesTitle');&nbsp; &nbsp; section_boxes.appendChild(boxes_h2);&nbsp; &nbsp; let boxes_p = document.createElement('p');&nbsp; &nbsp; boxes_p +1;&nbsp; &nbsp; boxes_p.setAttribute('class','boxesP');&nbsp; &nbsp; section_boxes.appendChild(boxes_p);&nbsp;&nbsp; &nbsp;&nbsp;};//Grabing classeslet getBoxes = document.getElementsByClassName('box');let getTitle = document.getElementsByClassName('boxesTitle');let getText = document.getElementsByClassName('boxesP');getText[0].innerHTML = "Some Random text";getTitle[0].innerHTML = "Title";for(i = 0; i < getBoxes.length; i++){&nbsp; &nbsp; getBoxes[i].style.backgroundColor = "#947062";};