Ukryj vs Usuń

Jaki jest najlepszy sposób obsługi elementów DOM, ukrywania lub usuwania ?. załóżmy, że środowisko może się zmieniać kilka razy. Elementy mogą mieć wywołania zwrotne kliknięcia lub inne wywołanie zwrotne zdarzenia.

Ukryć

Kiedy ukrywasz to, co najlepsze? Jeśli kliknięcie przycisku powoduje ukrycie wielu elementów, możesz ukryć je pojedynczo lub utworzyć reguły css, aby to zrobić.

Opcja 1:

<style>
.superContent{/*...*/}

.superContent.noEdit .occultable{
    display:none;
}
</style>

<form class=”superContent” action=”...”>
    <label>Name</label>
    <input type=”text” />
    <input type=”submit” class=”occultable” value=”send”/>
</form>

<button id=”hideAll”>Edit</button>
<script type=”text/javascript”>
    $(“#hideAll”).click(function(){
        $(“.superContent”).toggleClass(“noEdit”);
    });
</script>

http://jsfiddle.net/p8mU8/

Inną opcją jest po prostu ukrycie żądanych elementów (może to być kilka lub wiele):

Opcja 2:

<script type=”text/javascript”>
    $(“#hideAll”).click(function(){
        $(“.occultable”).toggle();
    });
</script>

http://jsfiddle.net/JAmF9/

Usunąć

Aby zmodyfikować DOM, możesz również usunąć niechciane elementy i ponownie je wstawić później.

Opcja 3:

<form class="superContent">
    <label>Name</label>
    <input type="text" />
    <input id="sendbutton" type="submit" class="occultable" value="send"/>
</form>

<button id="hideAll">Edit</button>​

<script type=”text/javascript”>
$("#hideAll").click(function(){
    if( $(".superContent").find("#sendbutton").length>0 ){
        $(".superContent").find("#sendbutton").remove();
    }
    else{
        $(".superContent").append('<input id="sendbutton" type="submit" class="occultable" value="send"/>');
    }
});​
</script>

http://jsfiddle.net/Yj5Aw/

To tylko małe przykłady. Zakładając interfejs użytkownika zawierający dużą liczbę elementów. Co uważasz za najlepszą opcję ?. Który ma mniej wycieku pamięci i większą wydajność?

Istnieją pewne struktury javascript, takie jak kendo-ui, które usuwają elementy. jQueryUI woli ukrywać elementy, ale można sortować kartę widgetów, aby utworzyć kartę tymczasowo przeciągniętą przez użytkownika.