如何從.load（）的頁面訪問CSS屬性？

Question

我想將整個網站加載到我的網站中。 我已經可以通過$(#preview).load("index.php")到我的<div id="preview"></div>來做到這一點。 我在這里遇到的麻煩是背景圖像，它是身體的屬性。 我嘗試制作一個帶有background-image屬性的div標簽，但是當我從body標簽中刪除該圖像時，它的行為不像我想要的那樣（未填充整個空間）。

我的問題是這個。 我如何從index.php訪問某些內容，可以使我正確預覽網站或將屬性從某處復制到預覽背景圖像屬性中？

經過大量嘗試和錯誤之后，我的代碼現在看起來像這樣（更像是錯誤和錯誤，並且變得越來越雜亂）

    $(document).ready(
        function() {    
            $("#check").click(
                function() {
                    var bgd;
                    $("#preview").load("index.php", 
                        function () {
                            bgd = $("#bg").css("background-image");
                        }
                    );
                    $("#preview").style.backgroundImage(bgd);
                }
            );
        }
    );

其中bg是div的ID，它用作index.php中的“替代”主體標簽（也具有與主體相同的屬性）

我要么離它很遠，要么離譜。 感謝您可以獲得的每條建議。

Answer 1

   $(document).ready(
        function() {    
            $("#check").click(
                function() {
                    $.ajax({
                             url: 'index.php',
                             success: function(data){
                                 data = $('data').html();
                                 $('#preview').html(data);
                                 bg = $('data').find('#bg').css('background-image');
                                 $('#preview').css('background-image',bg);
                             }
                        });

                }
            );
        }
    );

Answer 2

這里有兩個問題。 一個與您訪問樣式屬性的方式有關，另一個與load()的異步行為有關。

風格問題

您需要使用$("#preview").css('background-image',bgd) 。 通過使用非jQuery包裝的元素，仍然可以使用您使用的第一種方法，如下所示：

$("#preview")[0].style.backgroundImage(bgd);

異步問題

第二個問題是.load（）是立即返回的異步調用。 下一行代碼將被執行，並且bdg （很有可能）仍未定義。 然后，當load()完成時，將執行成功處理程序，並將bdg設置為已加載頁面的背景，但是為時已晚！

將$("#preview").css('background-image',bgd)移至成功處理程序將糾正該問題：

   $(document).ready(
        function() {    
            $("#check").click(
                function() {
                    var bgd;
                    $("#preview").load("index.php", 
                        function () {
                            bgd = $("#bg").css("background-image");
                            $("#preview").css('background-image',bgd);
                        }
                    );
                }
            );
        }
    );