JavaScript - 如何将 div 内容复制到另一个页面

Question

我想自动复制页面1上一个div的内容并将其粘贴到页面2的一个div中？实现这个功能最好、最简单的方法是什么？

- macrog

Answer 1

仅适用于JavaScript和支持HTML5的情况，

页面1：

var pageContent = document.getElementById("myDiv1").innerHTML; 
sessionStorage.setItem("page1content", pageContent);

第二页：

document.getElementById("myDiv2").innerHTML=sessionStorage.getItem("page1content");

- Kyo

---

它原本是localStorage，但考虑到你不想让一些HTML代码永久存储在其中，所以决定使用sessionStorage可能会更好。 - Kyo

Answer 2

我认为最简单的方法是使用iframe。 您只需查看页面1的内容并在页面2上显示它。

一个快速的例子：

<iframe name="inlineframe" src="pag1.html" frameborder="0" scrolling="auto" width="500" height="500" marginwidth="5" marginheight="5" ></iframe>

这是一个“简单”的解决方案。但当然还有其他方法。 这个解决方案很容易，因为你不需要使用jquery。

- Kees Sonnema

Answer 3

这在jQuery中更容易实现，但你可以使用innerHTML获取div的html内容，如下：

var div1 = document.getElementById('div1'),
div1html = div1.innerHTML;

将其复制到另一个页面上的 div 中需要一些工作。

我知道这并没有完全回答你的问题，我只是给你一些关于如何获取元素的 HTML 的见解。使用 JS 复制它可能会像这样：

var div2 = document.getElementById('div2')
div2.appendChild(div1.cloneNode(true));

- Galadre

Answer 4

根据您的要求，当用户剪切复制时可以将div的值保存在LocalStorage中，然后在用户点击粘贴时从LocalStorage中读取它。这是最简单的方法。

不幸的是，如果您想实际上将内容放到用户系统的剪贴板上，您需要使用Flash。

- frosty