Question

<div id="main">
    <div id="abc">
        <div>
            This is the div to be replaced
        </div>
    </div>
    <div id="xyz" style="display:none">
        <div>
            This is the div replaced
        </div>
    </div>
</div>

我已经像这样给了它

$('#main').children('div:eq(0)').css('display','none')
$('#main').children('div:eq(0)').replaceWith($('#xyz').html())

但是，如果我看到输出，我只能将其作为<div>This is the div replaced</div>，而不是<div id="xyz">

的父div。

Answer 1

我认为你实际上在寻找切换功能。

请检查 fiddle

$('#main').click(function(){
    $('#main>div').toggle();
});

Answer 2

http://api.jquery.com/html/

基本上，您获得了innerHTML $（＆＃39;＃xyz＆＃39;），而不是整个代码本身。

只做

$('#main').children('div:eq(0)').replaceWith($('#xyz'))

Answer 3

var isDisplayed = $("#main").find("#abc").css("display");
if(isDisplayed == "block"){
  $("#main").find("#abc").css("display","none");
  $("#main").find("#xyz").css("display","block");
}
else{
  $("#main").find("#abc").css("display","block");
  $("#main").find("#xyz").css("display","none");
}

Answer 4

也许你正在寻找这个：

$('#main').children('div:eq(0)').replaceWith(xyz);

Answer 5

试试这个

$('#main').find('div:eq(0)').css('display','none');
$('#main').children('div:eq(0)').replaceWith($('#xyz'));

通过指定$('#xyz').html()，您只能获得div的内容。

有关replaceWith的更多信息，请参阅jQuery docs

Answer 6

我认为这应该做你想要的：

$('#main div:first').html($('#xyz').html())

我需要使用jQuery将div替换为另一个div

6 个答案: