javascript - 将 html 块从一个页面移动到另一个页面
问题描述
我如何将一些 html 元素从一个页面移动到另一个页面,我认为如果我将两个 html 页面链接到同一个 Js 页面,JS 就可以完成这项工作,但我错了,我觉得这很容易做到,但我可以'不这样做我在这里搜索了堆栈溢出和谷歌,但没有找到可以解决问题的东西
这是一个例子:
索引.html
<div id="parent1" class="container">
<h1>text</h1>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore
<span class="icon">icon</span></p>
</div>
<a href="#" class="btn">click me</a>
我想要当我点击 btn
我将里面#parent1
的内容移动到页面#parent2
中的内容时input.html
输入.html
<div id="parent2" class="con">
</div>
我已阅读但未解决问题的问题:“剪切和粘贴” - 使用 Javascript 在 DOM 中移动节点
如何使用 JavaScript 将所有 HTML 元素子元素移动到另一个父元素?
这些问题对我有一点帮助,但它使用 XML 和 Jquery,我不熟悉它们有没有更简单的解决方案,提前谢谢你
解决方案
试试这个代码,它会如你所愿。
在第一页将数据存储到 localStorage 变量中
var page_content = document.getElementById("parent1").innerHTML;
console.log( page_content );
localStorage.setItem("page_content", page_content );
在第 2 页上检索第 1 页数据
document.getElementById("parent2").innerHTML = localStorage.getItem("page_content");
console.log( page_content );
打开控制台以在第一页成功存储确认数据。
推荐阅读
- c++ - C ++ - 将一维数组排序为二维数组,其中数字在一个范围内
- node.js - 将 Angular 应用程序部署到 Heroku,构建成功,但在浏览器中显示 404 not found
- excel - 使用按钮运行时,我的宏运行速度更快,但从开发人员窗格运行时运行速度变慢
- java - 处理文本文件中的单个字符(或数字)
- python - 在python中循环 - 重复句子,只改变里面的数字
- javascript - Angularjs $stateChangeStart 检查字符串是否在对象中
- javascript - 如何将javascript请求转换为curl
- typescript - 打字稿:推断函数参数
- mysql - 使用内连接从多个表中获取列数据
- javascript - msgwindow 文档中的 Javascript 断线写入