jQuery 在 DIV 之间复制内容

Question

我正在开发一个完全基于 Javascript 的网站：加载该网站，然后所有页面都由 Javascript 拉入。

所以我这就是我所拥有的：

    <span id="deathWormButton">Death Worm</span>
    <div id="pageContent">
        <p>Thanks for taking the time to view my portfolio!</p>
        <p>Placeholder content</p>
        <p>Placeholder content</p>
        <p>Placeholder content</p>
        <p>Placeholder content</p>
    </div>
    <div id="DeathWormPage" class="page">
        <p>Thanks for taking the time to view my portfolio!</p>
        <p>Placeholder content</p>
        <p>Placeholder content</p>
        <p>Placeholder content</p>
        <p>Placeholder content</p>
    </div>

这是我的 jQuery：

        $(document).ready(function()
        {
            $(".page").hide();
        });
        $("#deathWormButton").click(function()
        {
            $("#pageContent").innerHTML = $("#DeathWormPage").innerHTML;
        });

但它不起作用！ （查看此处）

那么如何从 div id="DeathWormPage"deathWormButton 时将 code> 插入 div id="pageContent"？

Answer 1

jquery 对象没有innerHTML 属性。

$(document).ready(function () {
    $(".page").hide();

    $("#deathWormButton").click(function () {
        $("#pageContent").html($("#DeathWormPage").html())
    })
});

另外，请将其放入文档就绪函数中，否则您将引用不存在的事物。

Answer 2

您可以执行以下操作：

$("#pageContent").html($("#DeathWormPage").html())

或者

$("#pageContent")[0].innerHTML = $("#DeathWormPage")[0].innerHTML;

后一种方法会获取可用 innerHTML 的实际 DOM 元素。

Answer 3

这可以将一个 div 的内容传输到另一个 div...祝你好运

body               { font-size: 16px; line-height: 2em;}
.deathWormButton   { border: 2px solid blue; width: 75px; height: 35px; z-index: 200; font-size: 14px; background-color:#00FF33; }
 


$(function(){
$(".deathWormButton").click(
  function () {
    var htmlStr = $("#pageContent").html();
    $("#DeathWormPage").text(htmlStr);
  }
);
});

 



DeathWorm 


And be one deathWormButton, long I stood  And looked down one as far as I could To where it bent in the undergrowth;
 


ok here-- deathworm button please place content here.
 

Answer 4

使用

$("#pageContent").replaceWith($("#DeathWormPage"));

应该也可以，并且更加简洁/语义化。