js实现创建删除html元素小结

(编辑:jimmy 日期: 2025/10/2 浏览:2)

如果我要创建一个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>";  

一句话新闻
高通与谷歌联手!首款骁龙PC优化Chrome浏览器发布
高通和谷歌日前宣布,推出首次面向搭载骁龙的Windows PC的优化版Chrome浏览器。
在对骁龙X Elite参考设计的初步测试中,全新的Chrome浏览器在Speedometer 2.1基准测试中实现了显著的性能提升。
预计在2024年年中之前,搭载骁龙X Elite计算平台的PC将面世。该浏览器的提前问世,有助于骁龙PC问世就获得满血表现。
谷歌高级副总裁Hiroshi Lockheimer表示,此次与高通的合作将有助于确保Chrome用户在当前ARM兼容的PC上获得最佳的浏览体验。