如何更改div标签的innerhtml位置

Question

我有像

这样的div类

<div role="columnheader" class="cell">Value

</div>

之后，我将一些输入添加为此div。

var Header = SomeMethod.text;
var inputChek = document.createElement("input");
inputChek.setAttribute("type","checkbox");
inputChek.setAttribute("id",col[i].id);
inputChek.onchange = MyMethod;
divClass[].appendChild(inputChek);

然后我得到了我的div有点像这样

<div role="columnheader" class="cell">Value
    <input type="checkbox" id="Value" >
</div>

我在输入标签之前获得了价值。我希望输入标签后的那些值。有什么方法我可以得到这个。

答案示例                       值     

Answer 1

您可以使用insertAdjacentElement()方法并将afterbegin设置为第一个参数。

＆＃13;

＆＃13;

var inputChek = document.createElement("input");
inputChek.setAttribute("type","checkbox");
inputChek.setAttribute("id", 'Value');
document.querySelector('div').insertAdjacentElement('afterbegin', inputChek);

＆＃13;

<div role="columnheader" class="cell">Value</div>

＆＃13;

＆＃13;

＆＃13;

Answer 2

而不是

divClass[].appendChild(inputChek);

使用它：

divClass[].insertBefore( inputChek, divClass[].firstChild );

Answer 3

您可以使用prepend函数https://jsfiddle.net/Lna6s2kz/1/

var Header = SomeMethod.text;
var inputChek = document.createElement("input");
inputChek.setAttribute("type","checkbox");
inputChek.setAttribute("id",col[i].id);
inputChek.onchange = MyMethod; 
divClass[].prepend(inputChek);