Question

jQuery - 是否可以复制和粘贴HTML？

从一个例子开始，如果我有这行HTML：

<div id="divToMove">
    ... somethings like 100 lines of code ...
</div>

我想知道我是否可以使用这个div并复制和粘贴多次......

我试图将一个jQuery / JS函数从javascript“添加”到HTML页面，但似乎这个过程太慢了。也许复制和粘贴（如果可能）更快...... 有些帮助吗？感谢

Answer 1

这样的东西？

<强> HTML

<input type="button" id="copy" value=" copy "/>

<div id="content">
    <span>here's a span</span>
    <div>and a div</div>
</div>

<强>的jQuery

$(function()  {
    $('#copy').click(function(){
        var content = $('#content').html();
        var newdiv = $("<div>");
        newdiv.html(content);
        $('#content').after(newdiv);
    });
  });

在行动中 http://jsfiddle.net/Town/5q2CK/

Answer 2

查看.clone（），你可以点击目标div之后做一些事情：

$('#targetDiv').click(function(){
   var cloned = $(this).clone();
   // now you could put at the end another div
   // $('#myOtherDiv').append(cloned);
   // or put insert after another div
   // $(cloned).insertAfter('#myOtherDiv');
});

Answer 3

您应该可以执行类似

的操作

var html = $( '#divToMove' ).html();

这将获取div的内容并将其放入变量html中。然后你可以转身

$( '#paste' ).append( html );

将'复制'html添加到该位置的末尾。还有一个prepend函数可以将html添加到容器的开头

$( '#paste' ).prepend( html );

这是我所知道的“复制和粘贴”html的唯一方法。有一点需要注意，.html（）将获取选择器的内容，而不是选择器指向的元素。

Answer 4

通过JavaScript在浏览器中无法复制和粘贴。这是一项安全限制

Answer 5

是的，这是可能的！以下代码将HTML从div“x”复制到div“y”：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
    <head>
    </head>
    <body>

        <div id="x">
            This is a test
            <span>this is another text</span>
        </div>

        <div id="y">
        </div>

        <script type="text/javascript">

            var  x = document.getElementById("x"),
                 y = document.getElementById("y");

            y.innerHTML = x.innerHTML;

        </script>

    </body>
</html>

Answer 6

复制并粘贴点击按钮jquery代码

<button id="copybtn">Copy</button>
<div id="toCopy">Content To Be Copied</div>

<div id="toPaste"></div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script>
$("#copybtn").click(function(){

   $('#toPaste').append($("#toCopy").html());

});
</script>

jQuery - 是否可以复制和粘贴HTML？

6 个答案: