将 div 附加到新 div答案

【问题标题】：Append a div to a new div将 div 附加到新 div
【发布时间】：2013-07-21 16:23:17
【问题描述】：

我正在使用 IPB，我将把每个类别放入一个新选项卡中，类别 div 是这样的：

<div id='category_100'>
<div id='category_104'>
<div id='category_102'>
<div id='category_101'>

我的标签内容是这样的：

<div class="content">
                    <div id="content-1" class="content-1">

                    </div>
</div>

并且类别 div 已经显示，但我希望它被移动到 content-1 div 而不重复，所以我希望它使用 jjava 脚本如何从它的 div 移动到这个 div？

<script>
  document.getElementById('content-1').appendChild(
    document.getElementById('category_100')
  );
</script>

这对我有用，但我怎样才能将超过 id 添加到 category_100

我希望它在一个脚本代码中是这样的，所以我不会重复脚本代码四次：

<div class="content">
                    <div id="content-1" class="content-1">
                        <div id='category_100'>
<div id='category_104'>
<div id='category_102'>
<div id='category_101'> 
                    </div>
</div>

使用我的两条线，这里建议的东西不起作用！

【问题讨论】：

当您附加文档中已经存在的元素时，该元素不会被复制，它只是移动（替换）它们......
Fiddle 如果我理解正确，这就是你需要的......
这行得通，但我怎样才能将多个 id 添加到类别 100
您能否提供您拥有的所有标记以及您希望获得什么样的结果...

标签： javascript jquery ipb

【解决方案1】：

试试这个代码：

$('div[id^="category_"]').appendTo('#content-1')

看看这个小提琴：http://jsfiddle.net/lulu3030/sjEPx/2/

【讨论】：

我会像这样粘贴它我应该添加什么？例如脚本或什么？
嘿，我的意思是如何将此代码添加到哪个标签的位置和内部，如果我的类别 ID 是 12、56、20 和这样的呢？
我编辑了我的答案。什么意思是“在哪里和在哪个标签里面”？你知道如何插入 Javascript 吗？

【解决方案2】：

“使用我的两条线，这里建议的东西不起作用！”

你只是得到一个带有 ID 的元素并试图附加它......

Live Demo

如果要追加多个元素，有很多方法...

包装这些元素，然后追加...

<div id="categories">
    <div id='category_100'></div>
    <div id='category_104'></div>
    <!-- etc. -->
</div>

document.getElementById('content-1').appendChild(document.getElementById('categories'));

或将相同的类添加到您要附加的所有元素...

<div id='category_100' class="myClass"></div>
<div id='category_104' class="myClass"></div>

[].forEach.call(document.getElementsByClassName("myClass"), function (value, index, array) {
    document.getElementById("content-1").appendChild(value);
});

或使用匹配某些模式的查询选择器获取元素...

[].forEach.call(document.querySelectorAll("div[id^='category_']"), function (value, index, array) {
    document.getElementById("content-1").appendChild(value);
});

等等

【讨论】：