爲什麼jQuery的添加「visibility：hidden的」到一個div和它所有的孩子時，我克隆它？

Question

所以，我有一個模板DIV這樣的：

<div class='container'> 
    <div class='mybox invisible' id='template'> 
    <span>some stuff</span> 
    <div>test</div> 
    </div> 
</div> 

所以我想克隆它來創建基於它的項目。

new_item = $('#template').clone() 
$(new_item).removeClass('invisible').attr('id','some_crap').appendTo('.container') 

它的作品非常漂亮。 但是，如果我運行這個代碼就文件READY（預加載某些項），然後一切變得內嵌visibility：hidden的加入（該.mybox DIV，及其所有子）。

我現在就是解決辦法，而不是預先加載DOM的準備我的項目，等待1秒，。

setTimeout (-> 
    preloadOffices() 
), 1000 

（是的，CoffeeScript的）

這似乎這樣的伎倆，但如果有更優雅的解決方案，我不知道。

Answer 1

.clone()不任意樣式值的對象是克隆補充。因此，我認爲只有兩個位置可能的解釋：

1. 的對象實際上visibility: hidden在document.ready()時間和一些代碼實際上是讓你的其他對象可見以後。 .clone()只是使對象的副本，因爲它們。它不會爲它們添加任意的樣式值。你克隆後

2. 其他一些代碼讓您克隆的對象visibility: hidden。

如果您向我們展示你的實際的頁面，我們可以容易弄清楚什麼是真正發生的事情。

你可以自己調試一下，通過單步執行代碼並觀察代碼運行時的狀態。或者，你可以插入檢查東西是在什麼狀態的一些語句的console.log

Answer 2

試試這個代碼..

//clones the div on window.load and sets attribute id 
    $(window).load(function(){ 

    new_item = $('#template').clone(); 
    $(new_item).attr('id','some_crap').appendTo('.container') 

    }); 

//on document.ready remove class 

    $(function(){ 

    $('#some_crap').removeClass('invisible'); 

    });