Ho pagina HTML:Come nascondere tutti gli elementi tranne uno con jquery?
<head></head>
<body>
<div>
<div>
<div id="myDiv">
</div>
</div>
</div>
</body>
come nascondere tutte le div, e solo il myDiv all'interno del corpo utilizzando jQuery?
Aggiornamento
La pagina può contenere alcuni altri elementi HTML, come alcune tabelle, ancore, p, e voglio solo vedere l'elemento myDiv.
questo dovrebbe funzionare:
$('div:not(#myDiv)').hide(); // hide everything that isn't #myDiv
$('#myDiv').appendTo('body'); // move #myDiv up to the body
Aggiornamento:
Se si vuole nascondere tutto questo, non solo div elementi, utilizzare questo, invece:
$('body > :not(#myDiv)').hide(); //hide all nodes directly under the body
$('#myDiv').appendTo('body');
Probabilmente più semplice è per avvolgere l'intera parte "nascosta" della pagina in un grande elemento contenitore, e nasconderlo direttamente però.
Come così:
<body>
<div id="contents">
<!-- a lot of other stuff here -->
<div id="myDiv>
</div>
</div>
</body>
allora si può solo fare questo, che è più pulito e più veloce:
$('#contents').hide();
$('#myDiv').appendTo('body');
$("div").each(function() { $(this).toggle(!!this.id); });
Si noti che questo sarà esplicitamente mostrerà #myDiv. Se si desidera solo per nascondere le altre div:
$("div:not(#myDiv)").show();
allora si può fare:
$("#myDiv").appendTo("body");
Se siete obiettivo è solo per vedere che il contenuto e non vedere qualsiasi altra cosa, si può sempre e solo Fai questo. Non hai bisogno di jQuery:
document.body.innerHTML=document.getElementById('myDiv').innerHTML;
Un bel approccio generale:
$('#the_id').siblings().hide()
$('#the_id').parents().siblings().hide()
funziona per qualsiasi tipo di elemento.
+1 questa è la risposta corretta. – Christophe
Mi manca qualcosa o questo approccio non funziona per elementi che sono profondamente annidati dal suo non ricorsivo ?! –
Userai '# the_id' dell'elemento che desideri visualizzare, indipendentemente da quanto profondamente annidato. La raccolta 'parents()' include tutti gli antenati (up-recursive). Non puoi nascondere i genitori dell'elemento o l'elemento stesso sarebbe nascosto; e non puoi nascondere i figli dell'elemento o l'elemento stesso non avrebbe contenuto (per i tipi di elementi in cui si applica tale concetto). –
e se la pagina contiene altri elementi, non tutti i DIV, ad esempio alcune tabelle, collegamenti e voglio solo mostrare myDiv? –
solo sul tema dell'efficienza, sarebbe * molto * più veloce per eseguire '$ (" * "). Hide(); $ ("# myDiv"). show(); 'confrontato con' $ ("*: not (#myDiv)") ' – nickf
@nickf buon punto, anche se ho aggiornato qualcosa che dovrebbe essere più veloce di entrambi opzioni: '$ ('body>: not (#myDiv)'). hide()'. Generalmente non ci sono troppi elementi direttamente sotto l'elemento del corpo. Inoltre, come accennato nella risposta, è ancora meglio saltare le assurdità e cercare un elemento wrapper. –