✔ Child-Elemente ohne Unterelemente entfernen

G

GoogleFreak

Grünschnabel
Hallo

Da mich das Googeln nicht weiter gebracht hat, frage ich hier:
Wie kann ich ein Child-Element ohne "Sub-Childs" bzw. Unterelemente löschen?

Beispiel:
Code: 
<div id="child1">Ich bin Child1 und <div id="subchild1">das ist Subchild1</div>.</div>

Wie kann ich "child1" löschen und "subchild1" behalten? Das heisst, dass nur noch
Code: 
<div id="subchild1">das ist Subchild1</div>
übrig bleibt.
removeChild() entfernt leider auch subchild1.

Danke für Eure Antworten und schönen Abend.
 
Moin,

du könntest eine Kopie dessen erstellen, was du behalten willst(bspw. per cloneNode) und statt mit removeChild() den Knoten zu entfernen, ihn per replaceChild() mit der erstellten Kopie ersetzen.
 
Hi

Danke für deine Antwort.

Ich hätte aber ein Problem wenn der Code so aussehen würde:
Code: 
<div id="child1">Ich bin Child1 und 
	<div id="subchild1">das ist Subchild1</div>.
	<div id="subchild2">Mein Name ist Subchild2, ich hab aber noch ein Subchild Namens
		<div id="subchild2_1">Subchild2_1, welches eines Namens
			<b id="subchild2_1_1">Subchild2_1_1</b>
			hat
		</div>
	</div>
</div>

Wie soll ich den Code rausfinden mit dem ich nachher das Child ersetze?

Freundliche Grüsse
 
Hi,

erstell ein Array aller Kindknoten des zu löschenden Elements. Dieses durchläufst du und prüfst, ob es sich um einen Elementknoten handelt. Im Erfolgsfall erstellst du in einem Clone-Array einen Clone. Anschliessend wird das Element durchlaufen, der Clone-Array durchlaufen und die Kopien in das Elternelement eingehängt.

Beispiel:
Code: 
<html>
<head>
<meta name="author" content="Quaese">
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1">
<script type="text/javascript">
  <!--
function removeIt(strID){
  var arrClones = new Array();

  // Element, das gelöscht werden soll
  var objDel = document.getElementById(strID);
  // Elternelement
  var objParent = objDel.parentNode;
  // Array aller Kindknoten des Ausgangselements
  var arrChildren = objDel.childNodes;

  // Alle Kindknoten durchlaufen
  for(var i=0; i<arrChildren.length; i++){
    // Falls es sich um einen Elementknoten handelt
    if(arrChildren[i].nodeType == 1){
      // Clone des Elementknotens erstellen und in Clone-Array ablegen
      arrClones[arrClones.length] = arrChildren[i].cloneNode(true);
    }
  }

  // Element löschen
  objParent.removeChild(objDel);

  // Alle Clones durchlaufen
  for(var i=0; i<arrClones.length; i++){
    // Clone in Elternelement einhängen
    objParent.appendChild(arrClones[i]);
  }
}
 //-->
</script>
</head>
<body>
<button onclick="removeIt('child1');">removeChild</button>
<div id="child1">Ich bin Child1 und
 <div id="subchild1">das ist Subchild1</div>.
 <div id="subchild2">Mein Name ist Subchild2, ich hab aber noch ein Subchild Namens
    <div id="subchild2_1">Subchild2_1, welches eines Namens
      <b id="subchild2_1_1">Subchild2_1_1</b>
      hat
    </div>
  </div>
</div>
</body>
</html>

Ciao
Quaese
 
Um antworten zu können musst du eingeloggt sein.

Neue Beiträge

Zurück