javascript - 将一个属性复制到 JQuery 中一组子元素的同一子元素中的另一个属性

Question

哇，太拗口了。我一直在努力解决这个问题，因为我仍然是 JQuery 选择器的新手。对此的任何帮助将不胜感激。我遇到一种情况，我使用 .children() 从父 div (id='A') 选择子 div (class='B') 的子集和 .slice() 。此外，我需要将每个孙子 div (class='C') 的 longdesc 属性值复制到其 div 内容。我正在考虑类似下面的内容，但我不知道在尝试获取 longdesc 的值时如何引用正确的孙子 div 。也许有更好的方法？帮助!

HTML:

<div id="A">
    <div class="B">
        <div class="C" longdesc="value1"></div>
    </div>
    <div class="B">
        <div class="C" longdesc="value2"></div> 
    </div>
    <div class="B">
        <div class="C" longdesc="value3"></div> 
    </div>
    <div class="B">
        <div class="C" longdesc="value4"></div> 
    </div>
</div>

JQuery:

$start = 0;
$end = 2;

$('#A').children().slice($start, $end).find('.C').html("??value of longdesc??");

输出:

<div id="A">
    <div class="B">
        <div class="C" longdesc="value1">value1</div>
    </div>
    <div class="B">
        <div class="C" longdesc="value2">value2</div> 
    </div>
    <div class="B">
        <div class="C" longdesc="value3">value3</div> 
    </div>
    <div class="B">
        <div class="C" longdesc="4"></div> 
    </div>
</div>

非常感谢!

Answer 1

使用version of .html() that take a function as parameter ..

$('#A').children().slice($start, $end+1).find('.C').html(function(){
    return $(this).attr('longdesc');
});

演示地址:http://jsfiddle.net/aaFt9/1/

---

您还需要使用 $end + 1 来匹配 value3 因为 slice 第二个参数是 up-to 但不包括它 ( 参见 Array.prototype.slice() docs at MDN )

---

此外，如果这是您真正的 html 结构，您可以跳过 .children() 并直接找到 .C 元素..

$('#A').find('.C').slice($start, $end+1).html(function(){
    return $(this).attr('longdesc');
});

演示地址:http://jsfiddle.net/aaFt9/2/