JavaScript ottenere elemento superiore e scrivi titolare div con i fratelli

Ho la seguente struttura:

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

A onload, io sono un “titolare” del div che contiene tutti i figli del padre in questo modo:

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

Conoscendo solo il “child1” id, come faccio ad aggiungere un titolare div intorno a sé e fratelli?

Considerazioni

  • Il “child1” id è l’unica nota identificatore.
  • La classe “padre” e “child2” sono dinamiche nome e cambierà, quindi, non possono essere utilizzate come identificatori.
  • deve essere JavaScript.

Pensieri?

  • Ha fatto la tua domanda originariamente jQuery tag e non dire “JavaScript”? Chiedo solo quanto hai tanti jQuery risposte (da me compreso) e sono sicuro che non è menzionato jQuery da qualche parte ho risposto!!!
  • Scusa James, non ho detto JQuery. (Il mio post non è stato modificato dal momento)
InformationsquelleAutor mika.el | 2012-07-05

 

2 Replies
  1. 29

    Vedere come questo deve essere JavaScript (e jQuery non) e si può solo individuare il child1 da id si potrebbe fare qualcosa di grezzo come questo:

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

    Spero che questo aiuta…

    • +1 per essere stato l’unico a notare “deve essere JavaScript”! Sono sicuro che il punto non era presente quando la domanda fu chiesto se…
    • Che qualcuno ha rimosso 🙁
    • Sì, .innerHTML è grezzo.
    • Ma questo non darà la risposta. Perché pensi che innerHTML è grezzo?
    • Se il “child2” div contiene 3 contenuti di terze parti (ad es. immagini e script) si utilizza .innerHTML non forzare il contenuto di ricarica? (Io non sono davanti al mio desktop per eseguire il test.)
    • Io non sono così sicuro che durante il test ho aggiunto un’immagine esterna al child1 div e si fa carico quando l’aggiornamento (tramite innerHTML). Inoltre non avevi detto che il tuo problema originale…
    • Sì sono d’accordo, è stato un ulteriore pensiero che mi è venuto a mente quando si utilizza innerHTML e il contenuto remoto. Ho bisogno di postare un’altra Domanda. Grazie per il vostro aiuto.
    • Grazie a tutti per il vostro aiuto.

  2. 2

    Ha detto di no jQuery, questo suona come un compito per casa, ma:

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

Lascia un commento