如何在JavaScript中创建一个对象，动态创建一个div（带有样式属性和id）并附加到html页面？

我正在尝试用javascript创建一个对象，该对象将动态创建一行样式属性，并将其附加到我的页面。我见过其他只创建元素的解决方案，但没有一个能够很好地适合单个对象

以下是我正在尝试的代码：

功能行（位置x、位置y、长度、宽度、颜色、数量）{
this=document.createElement（'div'）；
this.style.left=pos_x+“%”；
this.style.top=pos_y+“%”；
this.style.length=长度+“%”；
this.style.width=宽度+“%”；
this.style.backgroundColor=颜色；
this.id=“line”+num；
文件.附件（本）；
}
变量line1=line（10,0,100,100，#2EC71,1）不要设置此


此外，还有
style.width
，但没有长度属性

要使div可见，div需要
style.height>0px


功能行（位置x、位置y、厚度、宽度、颜色、数量）{
var line=document.createElement（'div'）；
line.style.left=位置x+“%”；
line.style.top=pos_y+“%”；
line.style.height=厚度+px；
line.style.width=宽度+“%”；
line.style.backgroundColor=颜色；
line.id=“line”+num；
文件。追加子项（行）；
回流线；
}
var line1=line（10,0,10100，#2EC71,1）一件事-如果我设置line=document.createElement（'div'）；然后使用line.someAttribute=someValue；我不是因为再次使用变量行而创建另一个元素吗？不是，您只是在设置对象行的属性