如何在新標簽頁中打開當前頁面並顯示隱藏的div

Question

是否可以單擊按鈕在新選項卡中打開同一頁面並顯示在父級中未看到的隱藏div？

當前，我有一個名為replaceiv的div，當用戶單擊按鈕時，它會在下面被替換文本替換 ...但是在父級中將替換它。 出於我的目的，我想將此頁面加載到新標簽中，並顯示頁面內容和“ 替換文本” ，而不是隱藏的replaceiv 。

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script> <script> $(document).ready(function(){ $("button").click(function(){ $("#replacediv").replaceWith("<span class='style'>Replacement Text</span>"); }); }); </script> 

 <div id="replacediv"></div> 

Answer 1

如果您希望$("#replacediv")和同一頁面中的跨度不相互替換，請執行以下操作：

$(document).ready(function(){
 $("#replacediv").before("<span style="display:none;" class='style'>Replacement Text</span>");
        $("button").click(function(){
            $(".style").show();
        });
    });

Answer 2

我認為做到這一點的一種方法是，當您打開頁面並添加URL參數時，這會導致頁面呈現不同的呈現方式，例如用URL參數中的Text替換頁面上的某些文本。 例如

在頁面上，您定義如下內容：

$(document).ready(function(){
    $("button").click(function(){
        window.open(window.location.href + '?replace=Replacement%20Text', '_blank');
    });

});

此外，您還需要類似的內容（仍在同一頁面上，但只有在使用參數調用時才處於活動狀態）

$(document).ready(function(){
    $("button").click(function(){
        window.open(window.location.href + '?replace=Replacement%20Text', '_blank');
    });

    var arr = location.href.match(/replace=([^&]+)/)
    var replace = arr[1];

    if (replace != '') {
         $("#replacediv").replaceWith("<span class='style'>" + replace + "</span>");
    }
});

此版本將使您的按鈕仍然可點擊。 如果您不想使用按鈕，則需要更早地請求URL參數，而不要首先呈現按鈕。 那取決於你。

它朝着正確的方向前進嗎？ 希望能有所幫助。