Question

我正在构建一个html页面，我需要将一个div中的html代码添加到另一个div中。

这是我的第一个div：

<div id="placeHolder" style="display:none">
    <div id="1">....</div>
    <div id="2">....</div>  
    <div id="3">....</div>      
</div>

我想将id为1,2和3的div添加到另一个div（#mainDiv），但不能同时添加所有div。

有没有办法用jquery添加部分html代码？我知道有一个名为append的函数但是我不知道它是否适合这种类型的ocasion ..

由于

Answer 1

我通过搜索stackoverflow找到了这个问题的答案。我猜你正在寻找像解释here那样的appendTo函数。所以，是的，你是对的，追加到我认为是一个很好的解决方案： - ）

Answer 2

比如说你想把它们从第二个div移到第一个div：

<div id="newPlace">
</div>

<div id="placeHolder">
  <div id="1">....</div>
  <div id="2">....</div>
  <div id="3">....</div>
</div>

然后你可以用jQuery选择元素，用附加方法将它们复制到另一个地方，然后从原来的地方删除它们：

$("#placeHolder div").appendTo("#newPlace").remove();

Answer 3

你可以试试这个：

<div id="placeHolder" style="display:none">
    <div id="1" onclick="change(this)">....</div>
    <div id="2" onclick="change(this)">....</div>  
    <div id="3" onclick="change(this)">....</div>      
</div>

使用Javascript：

function change(element) {
    if ($(element).attr('id') === 1) {
        $('#mainDiv').append($(element).html());
    } ...
    // AND THE SAME FOR EACH DIV. IF YOU DON'T HAVE TOO MUCH, THIS CAN BE A WAY
}

如果您的div上有onclick或您要用来触发此事件的任何事件，您可以使用此功能更改mainDiv的内容，具体取决于所选的元素，由{标识{1}}属性。

如果你设置的div数据没有在你的div中抛出任何事件，你只需添加我在你想要使用它的地方发布的功能。像这里：

id

Answer 4

假设这是你想要的

使用append（）

试试这个

$(function(){
  $('#mainDiv').append($('#1')); //to append div with id 1
  $('#mainDiv').append($('#2'));

});

fiddle here

Answer 5

不确定这是否是你一次添加html cod的意思......

假设您有一个新的div来添加HTML代码：

<div id="placeHolder" style="display:none">
    <div id="1">....</div>
    <div id="2">....</div>  
    <div id="3">....</div>      
</div>

<div class="result"></div>

你可以这样做：

$(document).ready(function (){
  $('#placeHolder').children().each(function (){
    $('.result').append(this);
    // do some other things
  });
});

使用children（）提取目标div中的所有子div，并使用每个（）来识别它们。

http://jsfiddle.net/nvQG8/1/

Answer 6

只需将其存储在字符串var中，然后在循环后附加它。

附加部分html代码jquery

6 个答案: