javascript - JQuery如何在创建的元素中创建元素

Question

有一个code我正在研究 - https://jsfiddle.net/md_bender/pj6a1akz/3/ .我需要创建新元素并将它们附加到现有元素 ul。创建元素并附加一切都可以。但是我不知道如何在创建的元素中创建子元素。我需要创建

<img src="path"/>

在我之前在脚本中创建的 div 中。一定是这样的

<div class="img-w js-popup">
    <img src="path"/>
</div>
<a href="delete.php">Delete</a>

但我唯一能做的就是创建为 div 的下一个同级

<div class="img-w js-popup"></div>
<img src="path"/>
<a href="delete.php">Delete</a>

谁能帮我解决我的问题？

Answer 1

您可以先将 img 附加到 div，然后再将那个 div 附加到 li。您也可以像这样编写相同的代码 Fiddle

$('<li/>')
  .append($('<div/>', {
    'class': 'img-w js-popup',
  }).append($('<img/>', {
    'src': '//www.gravatar.com/avatar/9142888a2ae6160f2faec90134eeafa3/?default=&s=80'
  })))
  .append($('<a/>', {
    href: 'delete.php',
    text: 'Delete'
  }))
  .appendTo('ul');

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<ul>
  <li>
    <div>
      <img src="//www.gravatar.com/avatar/9142888a2ae6160f2faec90134eeafa3/?default=&s=80" alt="" />
    </div>
    <a href="delete.php">Delete</a>
  </li>
</ul>