js实现创建删除html元素小结
如果我要创建一个div元素。
1.使用DOM对象创建:
使用document.createElement('div')方法创建元素。
2.使用JQuery创建:
使用$('<div>通过JQuery创建的新元素</div>')的方法直接创建元素。
如果需要将id是‘div2js'的div元素删除。
1.使用DOM对象
首先需要找到被删元素的父元素,通过父元素将其需要删除的子元素删除。
varel=document.getElementById('div2js');
el.parentNode.removeChild(el);
2.使用JQuery
直接找到并删除。
$('#div2js').remove();
最后我们来看个实例
<scripttype="text/javascript"language="Javascript">
functionInputOnBlur()
{varname=document.getElementById("name").value;
if(name.length>10||name.length<2)
{
varelement=document.getElementById("message");
if(element)
{
//alert(element.parentNode.innerHTML);
element.parentNode.removeChild(element);
}
varMySpan=document.createElement("span");
document.getElementById("containers").appendChild(MySpan);
MySpan.id="message";
MySpan.innerHTML="<imgsrc='false.jpg'alt='请输入正确的姓名'/>请输入正确的姓名";
}
else{
varelement=document.getElementById("message");
if(element)
{
//alert(element.innerHTML);
element.parentNode.removeChild(element);
}
varMySpan=document.createElement("span");
document.getElementById("containers").appendChild(MySpan);
MySpan.id="message";
MySpan.innerHTML="<imgsrc='true.gif'alt='该用户名输入正确'/>该用户名输入正确";
}
}
</script>
<div>
姓名:<inputid="name"type="text"onblur="InputOnBlur()"/><spanid="containers"></span></div>
<scriptlanguage="javascript">
document.getElementById("containers").innerHTML="<fontcolor=red>请输入姓名</font>";