Javascript 类构造函数问题。我无法在我的节目中得到我想要的

对不起，这可能是一个愚蠢的问题，但我真的不明白为什么这对我不起作用。我只是希望能够将myitem的结果写入到一个简单的div中。我已经在MouseOver上使用了一个函数来让它工作。但这不是必须的。我知道如何在警报中显示它

但是如何让myitem显示在div中呢

非常感谢您的帮助！：）

阶级
类项目{
建造商（名称、价格、数量）{
this.name=名称；
这个价格=价格；
这个。数量=数量；
}
sum（）{
返回此.price*此.quantity；
}
}
myitem=新项目（“苹果”，10,2）；
//这不起作用//document.getElementById（“example1”）.innerHTML=myitem.sum（）；
//这不起作用//document.getElementById（“example1”）.innerHTML=（myitem.sum（））；
//下面的这个很有用
函数myfunction（）{
document.getElementById（“example2”）.innerHTML=myitem.sum（）；
}
//这可以工作//警报（myitem.sum（））；
例1


例2

在事件发生之前，您不会调用该函数，而该函数不起作用的注释是因为您在加载

DOM

之前运行了脚本。您可以使用窗口事件

DOMContentLoaded

，该事件在加载

DOM

后触发，或者您可以将脚本移动到

Html

正文下方，如果使用窗口事件

DOMContentLoaded

，您可以执行以下操作：

class item {
        constructor(name, price, quantity) {
            
            this.name = name;
            this.price = price;
            this.quantity = quantity;

        }
        
        sum() {
            return this.price * this.quantity;
        }
    }
    myitem = new item("apple", 10, 2);


    //this down below works
     function myfunction () {             
         document.getElementById("example2").innerHTML = myitem.sum();
     }

     //wait for the DOM to load and then call the function
     window.addEventListener("DOMContentLoaded", function(){
         myfunction();
     });

---

example1

在您的脚本运行时没有呈现，请看，哦，那么仅仅因为我在“body”之前有脚本，它就没有按照我希望的方式运行？谢谢我现在让它为我工作：）

class item {
        constructor(name, price, quantity) {
            
            this.name = name;
            this.price = price;
            this.quantity = quantity;

        }
        
        sum() {
            return this.price * this.quantity;
        }
    }
    myitem = new item("apple", 10, 2);


    //this down below works
     function myfunction () {             
         document.getElementById("example2").innerHTML = myitem.sum();
     }

     //wait for the DOM to load and then call the function
     window.addEventListener("DOMContentLoaded", function(){
         myfunction();
     });