为什么我的类 Paragraph 没有制作段落元素<p>一种</p>在 JavaScript 中？

Question

I have the following piece of code in JS:

 class Paragraph { constructor(text) { this.text = text; this.createParagraph(); } createParagraph() { var paragraph = document.createElement('p'); var p = paragraph.appendChild(document.createTextNode(this.text)); return p; } } var a = new Paragraph("a"); // <p>a</p> This is the result I want, which I'm not getting console.dir(a);

I want to be able to create what I've described above through var a = new Paragraph("a"); but it isn't working, can anyone help out why?

Answer 1

There's two issues. Firstly createParagraph() needs to return the paragraph , not p as that contains the appended child element , in this case that's the text node.

Secondly the constructor needs to return the p you created in createParagraph() . Try this:

 class Paragraph { constructor(text) { this.text = text; return this.createParagraph(); } createParagraph() { var paragraph = document.createElement('p'); paragraph.appendChild(document.createTextNode(this.text)); return paragraph; } } var newPara = new Paragraph("Lorem ipsum"); document.body.appendChild(newPara); console.dir(newPara);

Answer 2

Change your function according to this solution:

createParagraph() {
    const paragraph = document.createElement('p');
    document.body.append(paragraph);
    const p = paragraph.appendChild(document.createTextNode(this.text));
    return p;
    }
}

Also don't use var .