本文给大家简单介绍了下使用 javascript 和 jquery 实现创建删除 html 元素的方法,非常的实用,有需要的小伙伴可以参考下。
Javascript 是一种由 Netscape 的 LiveScript 发展而来的原型化继承的基于对象的动态类型的区分大小写的客户端脚本语言,主要目的是为了解决服务器端语言,比如 Perl,遗留的速度问题,为客户提供更流畅的浏览效果。
如果我要创建一个 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>";
来源: