Javascript jQuery：如何选择所有特定于div的类并将div中的所有内容附加到新div中

我正在为应用程序构建样式指南。我有几个不同小部件的示例。我已经用类“snippet”包装了我想用作代码段的每个html块。我在每个示例小部件下面有第二个空div，其类为“example”。我试图使用jQuery来选择包含代码片段的所有html块，获取div中的所有内容，并将其插入空div中（包装在pre和code标记中）

请参见以下示例：

<div class="panel panel-default">
    <div class="snippet panel-body">
        <h1>H1 Header Example</h1>
        <h2>H2 Header Example</h2>
        <h3>H3 Header Example</h3>
        <h4>H4 Header Example</h4>
        <p>
            Here is a p tag with a <a href="#">Link</a>
        </p>
    </div>
</div>
<div class="example">
</div>

H1标题示例
H2标题示例
H3报头示例
H4标头示例

这是一个带a的p标签

在类的每个示例小部件下面有第二个空div “榜样”。我正在尝试使用jQuery选择所有html块 使用代码片段，获取div中的所有内容并将其插入 在空div内部（包装在pre和code标记中）

如果正确解释问题，请尝试使用

.each（）

，

.innerHTML

，

textarea

元素

$（“.example”）。每个（函数（i，el）{
el.innerHTML=“”
+$（“.snippet”）[i].innerHTML
+ ""
})

H1标题示例
H2标题示例
H3报头示例
H4标头示例

这是一个带a的p标签

出现此错误的原因是[0]返回的是普通Dom对象，而不是jquery对象

$('.snippet').each(function(i, item){ 
   $(item).next().text($(item).html());
  }
);

---

使用

$（'.example'）.html（$（'.snippet'）.html（））
你的意思是这样的吗


$（.example”）.append（）；
$（“.example code”）.html（$（“.snippet”）.html（）.replace（//g，”）

H1标题示例
H2标题示例
H3报头示例
H4标头示例

这是一个带a的p标签

在html文件顶部添加此链接

 <script>
  $(document).ready(function () {  
     $('.example').html($('.snippet').clone()); 
    //$('.panel  .snippet').remove(); // use this portion to remove the previous div
   });
</script> 



在代码的底部，复制div内容并将其放入“.example”div中


$（文档）.ready（函数（）{
$（'.example'）.html（$（'.snippet'）.clone（））；
//$（'.panel.snippet'）.remove（）；//使用此部分删除上一个div
});
在电话上打字需要一段时间；）但是这个答案中的display div在哪里呢？我认为目的是查看代码（因此是pre和code元素）。所以您需要
$（item.next（）.text（$（item.html（））已使用您的建议更新。因此，您的下一个
不会返回任何
。snippet
和
。example
不是同级，并且您没有添加
或
。是否每个
.snippet
元素都有
。example
元素在后面？是否要求将所有
.snippet
元素
html
附加到单个
。示例
元素，或者对于每个
.snippet
元素，在
之后将该元素
html
附加到相应的
元素。示例
元素？尝试使用代替。前者返回一个
jQuery
集合，该集合将有一个方法，其中包含单个
元素
。为什么
textarea
而不是问题中提到的
？@JamesMontagne不完全确定，尽管它试图呈现实际的
html
标记
pre
，
code
可能会被
textarea
取代是的，我同意你的意图是正确的。我只是好奇。Textarea允许编辑可能不需要的内容。@JamesMontagne“Textarea允许编辑可能不需要的内容。”可以将
禁用的
属性添加到
Textarea
，请参阅更新的帖子如果不需要编辑，最好把textarea放在一起，使用code/pre元素——这就是它们的用途。这是一个有用的答案。我正在使用codemirror，因此没有必要替换“”。
 <script>
  $(document).ready(function () {  
     $('.example').html($('.snippet').clone()); 
    //$('.panel  .snippet').remove(); // use this portion to remove the previous div
   });
</script>