【问题标题】:Move element 2 places up向上移动元素 2 个位置
【发布时间】:2019-04-12 08:48:42
【问题描述】:

我正在尝试将一个元素向上移动两个位置

我尝试了很多不同的选项,但我无法正确... 这是我最新的代码:

<div id="basket">
   <dl>
      <dt>Element 1</dt>
      <dd class="price">£32.00</dd>
      <dd class="qty"> 1x </dd>  //Need to move this element 2 levels up, right before dt

      <dt>Element 2</dt>
      <dd class="price">£6.00</dd>
      <dd class="qty"> 1x </dd>  //But this one as well
   </dl>            
</div>
$("#basket dd.qty").each(function() {
   var e = $(this);
   e.prevAll("dt").insertAfter(e);
});

根据上面的代码,我想在它之前的 dt 之前显示 .qty,所以结果应该是:

<dd class="qty"> 1x </dd>
<dt>Element 2</dt>
<dd class="price">£6.00</dd>

【问题讨论】:

  • 这会导致标记无效,不是吗?理想情况下,&lt;dd&gt; 前面应该有一个&lt;dt&gt;(或&lt;dd&gt;)。

标签: javascript jquery html next


【解决方案1】:

你可以这样做:

$('#Basket .qty').each(function() {
  var sib = $(this).prev().prev()
  sib.before($(this))
});

$('#Basket .qty').each(function() {
  var sib = $(this).prev().prev()
  sib.before($(this))
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id="Basket">
  <dl>
    <dt>Element 1</dt>
    <dd class="price">£32.00</dd>
    <dd class="qty"> 1x </dd>

    <dt>Element 2</dt>
    <dd class="price">£6.00</dd>
    <dd class="qty"> 1x </dd>
  </dl>
</div>

请注意,理想的用法是在&lt;dd&gt; 之前有一个&lt;dt&gt;

【讨论】:

  • 虽然这符合 OP 的要求,但它使第一个 qty 元素成为孤立元素,第二个元素成为错误 dt 的子元素。
  • @SalmanA 非常正确,老实说,我想念那部分。我会在答案中添加注释。
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 2017-12-25
  • 2018-04-22
  • 1970-01-01
  • 2017-11-24
  • 2017-10-19
  • 1970-01-01
  • 2014-05-08
相关资源
最近更新 更多