Javascript 如何对齐待办事项列表的复选框？

我正试图用html/css/js为我的第一个编码项目创建一个待办事项列表。 我使用js创建了一个包含复选框输入的

元素。当我运行代码时，复选框显示在显示文本的右侧。我想使复选框向左对齐或设置样式，但我不知道如何执行此操作。如果这是一个非常模糊的问题，我很抱歉

函数printInput（）{
var toDoInput=document.getElementById（“textbox”）.value；
var para=document.createElement（“li”）；
para.innerText=toDoInput；
var checkBox=document.createElement（“输入”）；
checkBox.type=“checkBox”；
checkBox.className=“cb”；
第3段（复选框）；
文件.getElementById（“段落”）.appendChild（段落）；
}
函数enter（）{
如果（event.keyCode===13）{
document.getElementById（“enterButton”）。单击（）；
}
}

.container{
边框样式：虚线；
边框宽度：4px；
显示器：flex；
柔性流：柱包裹；
对齐项目：居中；
证明内容：中心；
保证金：自动；
宽度：40%；
垫底：20%；
}
李{
列表样式类型：无；
}
#段落{
宽度：100%；
明确：两者皆有；
保证金：0；
填充：8px 0 8px 10px；
}
.集装箱{
宽度：500px；
明确：两者皆有；
显示：表格；
}
李{
显示器：flex；
边框底部：1px实心#cfcbcc；
}
h1{
文本对齐：居中；
}

你今天要做什么？

在向元素添加文本后，您正在添加复选框。文本块也被视为元素内的节点。因此

para.childNodes

还提供文本节点

para.childnodes[0]

是从代码输入中添加的文本

通过使用

para.insertBefore（复选框，para.childNodes[0]）我们可以在文本节点之前添加复选框

insertBefore
允许您在另一个元素之前插入一个元素
appendChild
始终将（追加）添加到节点列表的末尾

在DOM中也有其他方法可以做到这一点


函数printInput（）{
var toDoInput=document.getElementById（“textbox”）.value；
var para=document.createElement（“li”）；
para.innerText=toDoInput；
var checkBox=document.createElement（“输入”）；
checkBox.type=“checkBox”；
checkBox.className=“cb”；
//此行将在文本节点之前插入复选框
para.insertBefore（复选框，para.childNodes[0]）；
文件.getElementById（“段落”）.appendChild（段落）；
}
函数enter（）{
如果（event.keyCode===13）{
document.getElementById（“enterButton”）。单击（）；
}
}
.container{
边框样式：虚线；
边框宽度：4px；
显示器：flex；
柔性流：柱包裹；
对齐项目：居中；
证明内容：中心；
保证金：自动；
宽度：40%；
垫底：20%；
}
李{
列表样式类型：无；
}
#段落{
宽度：100%；
明确：两者皆有；
保证金：0；
填充：8px 0 8px 10px；
}
.集装箱{
宽度：500px；
明确：两者皆有；
显示：表格；
}
李{
显示器：flex；
边框底部：1px实心#cfcbcc；
}
h1{
文本对齐：居中；
}
你今天要做什么？

要如何对齐复选框？请注意，首先添加测试，然后添加输入。如果要创建复选框，然后添加文本（使用
innerHTML+=
而不是
textContent
），则复选框将位于左侧。@O.O我想尝试将复选框一直设置到容器的右侧，以使其标准化，或者设置到容器的最左侧。对不起，我没有说清楚我的qn。