jquery - jQuery dd 选择

Question

如果我有下面的代码，是否可以分别选择第一个、第二个和第三个 dd。例如，如果我想将子价格更改为 30，运费更改为 10，总价更改为 40，我将如何在 jquery 中分别选择每个 dd？我知道我可以添加类并通过它来完成，我只是想知道是否还有另一种方法。

<dl class="cart">
  <dt>Sub-Total:</dt>
    <dd>10.00</dd>
  <dt>Shipping</dt>
    <dd>5.00</dd>
  <dt>Total:</dt>
    <dd>15.00</dd>
</dl>

另外我将如何添加jquery

  <dt>Discount</dt>
    <dd>-5.00</dd>

总 dt 正上方

Answer 1

var newDD = '<dt>Discount</dt><dd>-5.00</dd>';

$('dd', '.cart').eq(0).text(30);
$('dd', '.cart').eq(1).text(10);    
$('dd', '.cart').eq(2).text(40);    

$('dt', '.cart').last().before(newDD);

小提琴

Answer 2

选择器返回匹配元素的数组。只需使用索引即可获得所需的索引。

$("dd")[0] gives you the first one.

或者，您可以使用 nth-child 选择器

$("dl dd:nth-child(1)")

Answer 3

http://jsfiddle.net/Neverever/37hSb/

// Update Price
var updatedPrice = [10, 30, 40]

$("dl.cart > dd").each(function(idx, elm) {
   $(elm).text(updatedPrice[idx]);
});

// Insert Discount
$("<dt>Discount</dt><dd>-5.00</dd>")
   .insertBefore("dl.cart > dt:last");​