JavaScript基础 将一个div中的所有内容赋值给另一个div innerHTML

Posted

tags:

篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了JavaScript基础 将一个div中的所有内容赋值给另一个div innerHTML相关的知识，希望对你有一定的参考价值。

 镇场诗：
　　　　清心感悟智慧语，不着世间名与利。学水处下纳百川，舍尽贡高我慢意。
　　　　学有小成返哺根，愿铸一良心博客。诚心于此写经验，愿见文者得启发。
——————————————————————————————————————————

code:

<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title></title>
	<script type="text/javascript">
        
	    function CopyContentToNewDiv()
	    {
	        var fatherDiv = document.getElementById("father");
	        var sonDiv = document.getElementById("son");
	        //将fatherDiv中的所有内容 包括HTML标签 给son
	        sonDiv.innerHTML = fatherDiv.innerHTML;
	    }
        //效果测试时，那个button的闪现 挺有意思的。
	</script>
</head>
<body>
    <div id="father">
        <h1>hello</h1>
        <p>world</p>
    </div>
    <div id="son">

    </div>
    <input type="button" onclick="CopyContentToNewDiv()" value="搬运" />
</body>
</html>

 

 


result:

　　点击按钮之前，

技术分享

 

 

　　点击按钮之后，

技术分享

 



——————————————————————————————————————————
博文的精髓，在技术部分，更在镇场一诗。IDE: VS2015;浏览器: Firefox。
html+css+js，强，值得努力学习。传智播客的视频教程是我的学习资源,推荐。
如果博文有可以改进的地方，请留下评论，我会认真思考的。

注：我是一位正在努力的普通人，此文仅供测试与参考使用，不可做其他用途。当参考博文内容时，代表您已接受使用条款。














以上是关于JavaScript基础 将一个div中的所有内容赋值给另一个div innerHTML的主要内容，如果未能解决你的问题，请参考以下文章

Javascript 播放 Div 中的所有音频元素

使用复选框交换div中所有内容的位置

仅由子 div 滚动 js 将内容推送到 Firefox 中的父 div

使用javascript函数将复杂的HTML附加到div？

如何在使用javascript单击div中的链接时禁用div中的所有其他链接[重复]

根据下拉菜单中的选择更改 div 的内容