Javascript 如何使用jQuery将div移动到唯一的li id

我有这个HTML，来自

li

的

id

是从PHP自动生成的

<ul>
  <li id="1">content</li> //comment
  <div id="will-append-to-li-id-1"></div> //parent comment
  <li id="2">content</li>
  <li id="3">content</li> //comment
  <div id="will-append-to-li-id-3"></div> //parent comment
  <li id="..">more content</li>
</ul>

这很好，但是

div

也会移动到

li id=“2”

，

li id=“3”

等等。 如何使div仅移动到

li id=“1”

更新

此实际HTML代码：

<ul class="comment-list">
  <li id="li-comment-1">
    <div class="content-comment">comment text here</div>
  </li>
  <ol class="child-comment"> <!-- child from li-comment-1 -->
    <div class="the-child-comment">parent comment text here</div>
  </ol>
  <li id="li-comment-2">
    <div class="content-comment">comment text here</div>
  </li>
  <li id="li-comment-3">
    <div class="content-comment">comment text here</div>
  </li>
  <ol class="child-comment"> <!-- child from li-comment-3 -->
    <div class="the-child-comment">parent comment text here</div>
  </ol>
</ul>

评论文本在这里

此处为父注释文本

评论文本在这里


评论文本在这里

此处为父注释文本

我想将

移动到

谢谢。

请指定#1

编辑：根据您的评论，尝试以下操作：

$(document).ready(function () {
   $lis = $("ul > li");
   $li = $($lis[0]); // to get the first li
   $("ul > li + div#will-append-to-li-id-1").appendTo($li);
});

<li id="1">content<div id="will-append-to-li-id-1"></div></li>

---

这将把属于

ul

的子级的所有

div

移动到上一个

li

$(document).ready(function() {
  $('ul div').each(function() {
    $(this).appendTo($(this).prev('li'));
  });
});

请注意，只允许

li

s作为

ul

的直接子级，因此最好修改生成无效HTML的PHP代码

片段：

$（文档）.ready（函数（）{
$（'ul div'）。每个（函数（）{
$（this.appendTo（$（this.prev（'li'））；
});
});


内容//评论
//家长意见
内容
内容//评论
//家长意见
更多内容
以下是您的答案，考虑对代码进行最少的更改：

$(document).ready(function () {
   $("ul > li + div#will-append-to-li-id-1").appendTo("#1");
});

但是为了使代码更简洁，首先不建议使用数字作为ID，这不是所有浏览器都支持的，但希望您在这里使用数字只是为了简化。（确保您的身份证以字母开头）

此外，您显示这一点的方式并不是.append（）的工作方式，.append（）实际上会在列表项中添加div，因此看起来如下所示：

$(document).ready(function () {
   $lis = $("ul > li");
   $li = $($lis[0]); // to get the first li
   $("ul > li + div#will-append-to-li-id-1").appendTo($li);
});

<li id="1">content<div id="will-append-to-li-id-1"></div></li>

li id是用PHP自动生成的，因此id具有动态唯一编号，您的代码可以工作，但事实并非如此。如果希望将其附加到第一个
li
，但您不知道
li
具有什么id，请执行：
$（“#will-append-to-li-id-1”）。appendTo（'li:first'）我想我明白你想做什么。请参阅我的更新。工作正常，先生，但是如果
有家长，如何移动，我尝试$（this）.appendTo（$（this.prev（'li>div'））；不工作如果
div
是
li
的父级，您将使用
'div>li'
而不是
'li>div'
。但是，根据规范，
li
的父级只能是
ol
或
ul
。否，使用PHP生成的li id具有动态编号。那么id就不是您在most中描述的
1
。将动态数字传递给Javascript，或者像这样访问第n个元素（参见编辑）
.appendTo('ul > li:first-child');