Zusammenfassung der js-Implementierung zum Erstellen und Löschen von HTML-Elementen_Javascript-Fähigkeiten-js-Tutorial-php.cn

Zusammenfassung der js-Implementierung zum Erstellen und Löschen von HTML-Elementen_Javascript-Fähigkeiten

WBOY

Freigeben： 2016-05-16 15:37:39

Original

1342 Leute haben es durchsucht

Wenn ich ein div-Element erstellen möchte.

1. Mit DOM-Objekt erstellen:

Erstellen Sie Elemente mit der Methode document.createElement('div').

2. Erstellen Sie mit JQuery:

Erstellen Sie Elemente direkt mit der Methode $('

Neues Element erstellt über JQuery

').

Wenn Sie das div-Element mit der ID „div2js“ löschen müssen.

1. DOM-Objekte verwenden

Zuerst müssen Sie das übergeordnete Element des gelöschten Elements finden und die zu löschenden untergeordneten Elemente über das übergeordnete Element löschen.

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

Nach dem Login kopieren

2. Verwenden Sie JQuery

Direkt suchen und löschen.

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

Schauen wir uns zum Schluss noch ein Beispiel an

<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>";

Nach dem Login kopieren