js实现创建删除html元素小结
js实现创建删除html元素小结
发布时间:2016-12-30 来源:查字典编辑
摘要:如果我要创建一个div元素。1.使用DOM对象创建:使用document.createElement('div')方法创建元素。2.使用JQ...

如果我要创建一个div元素。

1.使用DOM对象创建:

使用document.createElement('div')方法创建元素。

2.使用JQuery创建:

使用$('<div>通过JQuery创建的新元素</div>')的方法直接创建元素。

如果需要将id是‘div2js'的div元素删除。

1.使用DOM对象

首先需要找到被删元素的父元素,通过父元素将其需要删除的子元素删除。

var el = document.getElementById('div2js'); el.parentNode.removeChild(el);

2.使用JQuery

直接找到并删除。

$('#div2js').remove();

最后我们来看个实例

<script type="text/javascript" language="Javascript"> function InputOnBlur() { var name=document.getElementById("name").value; if(name.length >10 || name.length<2) { var element=document.getElementById("message"); if(element) { //alert(element.parentNode.innerHTML); element.parentNode.removeChild(element); } var MySpan=document.createElement("span"); document.getElementById("containers").appendChild(MySpan); MySpan.id = "message"; MySpan.innerHTML = "<img src='false.jpg' alt='请输入正确的姓名'/>请输入正确的姓名"; } else{ var element=document.getElementById("message"); if(element) { //alert(element.innerHTML); element.parentNode.removeChild(element); } var MySpan=document.createElement("span"); document.getElementById("containers").appendChild(MySpan); MySpan.id = "message"; MySpan.innerHTML = "<img src='true.gif' alt='该用户名输入正确'/>该用户名输入正确"; } } </script> <div> 姓名:<input id="name" type="text" onblur="InputOnBlur()" /><span id="containers"></span></div> <script language="javascript"> document.getElementById("containers").innerHTML = "<font color=red>请输入姓名</font>";

推荐文章
猜你喜欢
附近的人在看
推荐阅读
拓展阅读
相关阅读
网友关注
最新Javascript教程学习
热门Javascript教程学习
编程开发子分类