Javascript 用<；部门>；在第一个子项后添加标记<；部门>；

我想在第一个孩子

这是html：

<details>
  <div class="first-child">Copyright 1999-2014.</div>
  <p> - by Refsnes Data. All Rights Reserved.</p>
  <p>All content and graphics on this web site are the property of the company Refsnes Data.</p>
</details>

版权1999-2014。
-根据参考数据。版权所有

本网站上的所有内容和图形均为公司参考数据的财产

我需要这样的输出：

<details>
     <div class="first-child">Copyright 1999-2014.</div>
     <div class="details_content">
       <p> - by Refsnes Data. All Rights Reserved.</p>
       <p>All content and graphics on this web site are the property of the company Refsnes Data.</p>
     </div>
</details>

$('details p').wrapAll('<div class="details_content" />');

版权1999-2014。
-根据参考数据。版权所有

本网站上的所有内容和图形均为公司参考数据的财产

这是我的尝试：但是，这不起作用

$(document).ready(function(){
    var sum=$('.first-child').html();
    $('.first-child').remove();
    $('details').wrapInner('<div class="details_content"></div>');
    $('<div class="first-child">' + sum +'</div>').appendTo($('details'));
    $('.details_content').hide();
    $('.first-child').click(function(){
        $('.details_content').slideToggle(0);   
    });
});

$（文档）.ready（函数（）{
var sum=$（'.first child'）.html（）；
$（'.first child'）.remove（）；
$（“详细信息”）.wrapInner（“”）；
$（''+sum+''）。附录（$（'details'）；
$（'.details_content'）.hide（）；
$（'.first child'）。单击（函数（）{
$（'.details_content'）。幻灯片切换（0）；
});
});

标签

版权1999-2014。

在

标签的最后生成。我想将其作为第一个子项生成

---

此外，是否有可用的优化解决方案？与其编写这么多代码？

将所有p元素封装在细节中，您可以这样做：

<details>
     <div class="first-child">Copyright 1999-2014.</div>
     <div class="details_content">
       <p> - by Refsnes Data. All Rights Reserved.</p>
       <p>All content and graphics on this web site are the property of the company Refsnes Data.</p>
     </div>
</details>

$('details p').wrapAll('<div class="details_content" />');

$（'details p'）.wrapAll（''）；

---

对于您希望的代码。first child div是第一个子项而不是最后一个子项，您应该使用prepend而不是append：

$('<div class="first-child">' + sum +'</div>').prependTo($('details'));

$（''+sum+''）.prependTo（$（'details'）；

要将所有p元素包装在详细信息中，可以执行以下操作：

<details>
     <div class="first-child">Copyright 1999-2014.</div>
     <div class="details_content">
       <p> - by Refsnes Data. All Rights Reserved.</p>
       <p>All content and graphics on this web site are the property of the company Refsnes Data.</p>
     </div>
</details>

$('details p').wrapAll('<div class="details_content" />');

$（'details p'）.wrapAll（''）；

---

对于您希望的代码。first child div是第一个子项而不是最后一个子项，您应该使用prepend而不是append：

$('<div class="first-child">' + sum +'</div>').prependTo($('details'));

$（''+sum+''）.prependTo（$（'details'）；

要将所有p元素包装在详细信息中，可以执行以下操作：

<details>
     <div class="first-child">Copyright 1999-2014.</div>
     <div class="details_content">
       <p> - by Refsnes Data. All Rights Reserved.</p>
       <p>All content and graphics on this web site are the property of the company Refsnes Data.</p>
     </div>
</details>

$('details p').wrapAll('<div class="details_content" />');

$（'details p'）.wrapAll（''）；

---

对于您希望的代码。first child div是第一个子项而不是最后一个子项，您应该使用prepend而不是append：

$('<div class="first-child">' + sum +'</div>').prependTo($('details'));

$（''+sum+''）.prependTo（$（'details'）；

要将所有p元素包装在详细信息中，可以执行以下操作：

<details>
     <div class="first-child">Copyright 1999-2014.</div>
     <div class="details_content">
       <p> - by Refsnes Data. All Rights Reserved.</p>
       <p>All content and graphics on this web site are the property of the company Refsnes Data.</p>
     </div>
</details>

$('details p').wrapAll('<div class="details_content" />');

$（'details p'）.wrapAll（''）；

---

对于您希望的代码。first child div是第一个子项而不是最后一个子项，您应该使用prepend而不是append：

$('<div class="first-child">' + sum +'</div>').prependTo($('details'));

$（''+sum+''）.prependTo（$（'details'）；

$（文档）.ready（函数（）{
$（“详情”）。附加（“”）；
$（“详情p”）。附录（“.details_content”）；
$（'.details_content'）.hide（）；
$（'.first child'）。单击（函数（）{
$（'.details_content'）。幻灯片切换（0）；
});
});

…这应该以最短的方式完成工作

[编辑]：好的，博詹德拉·萨赫的代码少了一行；）

$（文档）.ready（函数（）{
$（“详情”）。附加（“”）；
$（“详情p”）。附录（“.details_content”）；
$（'.details_content'）.hide（）；
$（'.first child'）。单击（函数（）{
$（'.details_content'）。幻灯片切换（0）；
});
});

…这应该以最短的方式完成工作

[编辑]：好的，博詹德拉·萨赫的代码少了一行；）

$（文档）.ready（函数（）{
$（“详情”）。附加（“”）；
$（“详情p”）。附录（“.details_content”）；
$（'.details_content'）.hide（）；
$（'.first child'）。单击（函数（）{
$（'.details_content'）。幻灯片切换（0）；
});
});

…这应该以最短的方式完成工作

[编辑]：好的，博詹德拉·萨赫的代码少了一行；）

$（文档）.ready（函数（）{
$（“详情”）。附加（“”）；
$（“详情p”）。附录（“.details_content”）；
$（'.details_content'）.hide（）；
$（'.first child'）。单击（函数（）{
$（'.details_content'）。幻灯片切换（0）；
});
});

…这应该以最短的方式完成工作

[编辑]：好的，博詹德拉·萨赫的代码少了一行；）