HTML将div附加到另一个div中
[英]Html append the div into another div
问题描述
我对我的HTML设计有疑问。 我在固定位置有一个<div> ... </div>部分。 我希望在body标签内的任何地方重用该<div></div> 。
我使用jQuery和JavaScript以及innerhtml('...') ， after('...') ， append('...')的方法进行了尝试。 它可以工作，但是我不想用引号解释100行，还有其他事情。 我希望多次包含该<div></div> 。
示例代码格式。
<html>
<head>
....
</head>
<body>
...
<div id='includes_div'> <!-- It hides on form load -->
...
... <!-- having 100 of lines -->
</div>
<div id='div1'>
<!-- want to include here -->
...
</div>
<div id='div2'>
<!-- want to include here -->
...
</div>
</body>
</html>
jQuery或JavaScript是否可能？
2 个解决方案
解决方案1
5 已采纳 2013-03-30 13:26:03
这应该工作：
var cont = $('#includes_div').html();
$('#div1').append(cont);
$('#div2').append(cont);
解决方案2
2 2013-03-30 13:35:10
有很多方法可以做到这一点，以下是我常用的两种方法。
第一种是使用jQuery'clone（）'方法：
var toClone = $('#includes_div');
var cloneContainers = $('#div1, #div2');
cloneContainers.each(function() {
var clonedDiv = toClone.clone();
clonedDiv.attr('id', '');
this.append(clonedDiv);
});
这将为您提供原始div的精确克隆，并将其放入每个容器中。 由于它是一个精确的克隆，因此您需要防止id冲突。
另一种方法是只使用第一个div的内容，而不是整个内容。
var content = $('#includes_div').html();
var containers = $('#div1, #div2');
containers.each(function() {
this.append(content);
});
显然，上面的代码是为了帮助分解过程而编写的，可以用更紧凑的形式编写它们。
获取选择框的html并追加到另一个div中
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.