2017-10-17 192 views
0

的innerHTML的位置我有一個像如何更改div標籤

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

</div> 

DIV類之後,我加入了一些輸入作爲achild到這個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> 

我正在輸入的標籤前值。我想要輸入標籤後的值。有什麼辦法可以解決這個問題嗎?

回答樣本 價值

回答

2

您可以使用insertAdjacentElement()方法並將afterbegin設置爲第一個參數。

var inputChek = document.createElement("input"); 
 
inputChek.setAttribute("type","checkbox"); 
 
inputChek.setAttribute("id", 'Value'); 
 
document.querySelector('div').insertAdjacentElement('afterbegin', inputChek);
<div role="columnheader" class="cell">Value</div>

1

而不是

divClass[].appendChild(inputChek); 

使用本:

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

可以使用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);