Question

JS 在input 后面添加一个div

function add_type(){
var submit_id = document.getElementById("attr_type_add");
submit_id.type="button";
submit_id.value="添加类型";
var newNode = document.createElement("div");//添加一个div
newNode.id = "new_id_type";//添加一个id
submit_id.insertBefore(newNode,submit_id.nextSibling);//在attr_type_add插入div

}
add_type();

添加后变成以下 后面多了个 </input> 怎么办?
<input type="button" value="添加类型" name="attr_type_add" id="attr_type_add" vld="{maxlength:255}"><div id="new_id_type1"></input>

Answer 1

insertBefore本来就是向某个标签添加元素的。

所以submit_id.insertBefore这么写是把input当作一个容器了。

function add_type(){
	var submit_id = document.getElementById("attr_type_add");
	submit_id.type="button";
	submit_id.value="添加类型";
	var newNode = document.createElement("div");//添加一个div		
	newNode.id = "new_id_type";//添加一个id			
	//newNode.insertAfter(newNode);//在attr_type_add插入div 
	var parent = submit_id.parentNode;
	if(parent.lastChild == submit_id){
		parent.appendChild(newNode)
	}else{
		submit_id.parentNode.insertBefore(newNode,submit_id.nextSibling)
	}
}
add_type();

Answer 2

方法用错了。
insertBefore() 方法在您指定的已有子节点之前插入新的子节点。
你在submit==input，肯定会插入到input中去。

看你想实现什么效果了。