JavaScript get-parent-element und schreiben-Halter div für Geschwister

Habe ich die folgende Struktur:

<div class="parent">
  <div id="child1">Content here</div>
  <div class="child2">Content here</div>
</div>

Bei onload, ich will einen "Halter" div, das gilt all den Eltern, die Kinder so:

<div class="parent">
  <div id="holder">
    <div id="child1">Content here</div>
    <div class="child2">Content here</div>
  </div>
</div>

Wissen nur die "child1" id, wie kann ich einen Halter div um sich selbst und die Geschwister?

Überlegungen

  • Dem "child1" - id ist die einzige bekannte Kennung.
  • Die Klasse "Eltern" und "child2" dynamische Namen und wird sich ändern, also können nicht als Bezeichner verwendet werden.
  • werden muss-vanilla-JavaScript.

Gedanken?

  • Hat deine Frage ursprünglich ein jQuery-tag und nicht sagen "vanilla JavaScript"? Nur Frage mich, da Sie so viele jQuery-Antworten (von mir aufgenommen) und ich bin mir sicher, dass es erwähnt jQuery irgendwo in der Zeit, die ich beantwortet!
  • Tut mir Leid James, ich wollte nicht schweigen JQuery. (Mein post wurde nicht editiert da)
InformationsquelleAutor mika.el | 2012-07-05
  1. 29

    Sehen, wie dies hat zu JavaScript (und jQuery nicht), und Sie können nur erkennen, die durch child1-id, die Sie tun konnte, so etwas plumpes wie diese:

    var child1 = document.getElementById("child1"),
    parent = child1.parentNode,
    contents = parent.innerHTML ;
    parent.innerHTML = '<div id="holder">' + contents + '</div>';

    Hoffe, das hilft...

    • +1 für die nur zu bemerken "muss vanilla JavaScript"! Ich bin mir sicher, dass das der Punkt war nicht dort, als die Frage, wurde zunächst gefragt, obwohl...
    • Die jemand entfernt hat 🙁
    • Ja, .innerHTML ist Rohöl.
    • Aber geben Sie die Antwort. Warum denkst du, innerHTML ist Rohöl?
    • Wenn die "kind2" div enthält 3rd party content (z.B. Bilder und script) verwenden .innerHTML nicht zwingen, den Inhalt neu zu laden? (Ich bin nicht vor meinen desktop zu testen.)
    • Ich bin nicht so sicher, dass wie bei der Prüfung ich fügte hinzu, ein externes Bild zu den child1 div und es nicht laden, wenn die nachlackierung (mit innerHTML). Auch Sie hat nicht erwähnt, dass im ursprünglichen problem...
    • Ja, ich Stimme zu, es war ein weiterer Gedanke in den Sinn kam, bei der Verwendung von innerHTML und remote-content. Vielleicht muss ich nach einer anderen Frage. Vielen Dank für deine Hilfe.
    • Ich danke Ihnen allen für Ihre Unterstützung.

    InformationsquelleAutor Mike Sav
  2. 2

    Er sagte kein jQuery, das klingt wie eine Hausaufgabe, aber:

    var el = document.getElementById('child1');
var parent = el.parentNode;
parent.innerHTML = '<div id="holder">' + parent.innerHTML + '</div>';
    InformationsquelleAutor anteatersa
Schreibe einen Kommentar