javascript - 我可以使用什么来使用 jquery 从具有相同类的 div 中获取一组文本？

Question

我有一个问题，我觉得应该很简单，但我在获得我需要的结果时遇到问题。我无法更改 HTML。任何帮助都会很棒!

我有这样的设置。

<div class="container">
    <a href="doesn'tmatter" class="myAtag"></a>
    <div class='mydiv'>this is text1</div>
</div>

<div class="container">
    <a href="doesn'tmatter"></a>
    <div class='mydiv'>this is text2</div>
</div>

我试图从每个 div 中获取文本，将其设置为一个 var，然后我可以使用它向其上方添加数据属性。

var DivText = $('mydiv').text();
$('.myAtag').attr('data', 'DivTest');

我遇到的问题是数据属性随后被两个 div 中的文本填充。

<div class="container">
    <a href="doesn'tmatter" class="myAtag" data="this is text1 this this text2"></a>
    <div class='mydiv'>this is text1</div>
</div>

<div class="container">
    <a href="doesn'tmatter" class="myAtag" data="this is text1 this this text2"></a>
    <div class='mydiv'>this is text2</div>
</div>

我可以使用什么/如何修改我的 jquery 来实现这个结果？

<div class="container">
    <a href="doesn'tmatter" class="myAtag" data="this is text1"></a>
    <div class='mydiv'>this is text1</div>
</div>

<div class="container">
    <a href="doesn'tmatter" class="myAtag" data="this this text2"></a>
    <div class='mydiv'>this is text2</div>
</div>

Answer 1

使用回调来不同地设置每个数据属性

$('.myAtag').attr('data-text', function() {
    return $(this).next('.mydiv').text();
});

FIDDLE

使用 key 通常是个好主意，如 data-whatever
您还可以使用 data()，但这会在 jQuery 内部设置数据，并且不会添加属性