jQuery將div附加到新div

Question

我必須將2 div附加到新的div上：

<script type="text/javascript">
        $(function() {
            $( "#table-filter_wrapper" ).append($( "<div class='main_tbl_btm_info'></div>" ));
            $( "#table-filter_info" ).appendTo( $( ".main_tbl_btm_info" ));
            $( "#table-filter_paginate" ).appendTo( $( ".main_tbl_btm_info" ));
        });
</script>

問題在於它無法立即找到table-filter_wrapper 。
當我在添加之前使用Alert時，它將起作用。
我如何獲取或未加載table-filter_wrapper 。

Answer 1

您需要像這樣從您的append刪除$ ：

<script type="text/javascript">
        $(function() {
            $( "#table-filter_wrapper" ).append( "<div class='main_tbl_btm_info'></div>");
            $( "#table-filter_info" ).appendTo(".main_tbl_btm_info" );
            $( "#table-filter_paginate" ).appendTo( ".main_tbl_btm_info");
        });
</script>

Answer 2

如果元素在DOM中可用，則您的代碼有效： http : //jsfiddle.net/XY7Sf/

<div id="table-filter_wrapper"></div>
<div id="table-filter_info"></div>
<div id="table-filter_paginate"></div>

如果它們在DOM中不可用，則需要在它們可用時運行此代碼，也許在某處的ajax回調中？

Answer 3

嘗試首先將包裝器div或表作為目標，並使用.find（）獲得要appentTo的類，例如：

var a = $(".wrapper").find(".main_tbl_btm_info")
$( "#table-filter_paginate" ).appendTo(a);

Answer 4

你想要這樣的東西，對嗎？

演示JSFIDDLE

JS：

$(function() {
            $( "#table-filter_wrapper" ).append($( "<div class='main_tbl_btm_info'>main_tbl_btm_info</div>" ));

    $( ".main_tbl_btm_info" ).append($( "<div id='table-filter_info'>table-filter_info</div>" ));

    $( ".main_tbl_btm_info" ).append($( "<div id='table-filter_paginate'>table-filter_paginate</div>" ));

}）;