Question

我正在尝试将子项的文本值放在各自的父数据元素中，但我将所有值放在一起。这是我的代码：

HTML

<ul>

<li class="item" data-v="1">
  <div class="xyz" data-v="2">
    <div class="abc" data-v="3">AED 12,00.00</div>
  </div>
</li>
<li class="item" data-v="1">
  <div class="xyz" data-v="2">
    <div class="abc" data-v="3">AED 13,00.00</div>
  </div>
</li>
<li class="item" data-v="1">
  <div class="xyz" data-v="2">
    <div class="abc" data-v="3">AED 15,00.00</div>
  </div>
</li>

Jquery的：

    var eee = $('.abc').text().replace(/[^0-9\.]+/g,"");
    $('.abc').parents('.item').attr('data-v', eee);

结果如下：

    <li class="item" data-v="1200.001300.001500.00">...</li>
    <li class="item" data-v="1200.001300.001500.00">...</li>
    <li class="item" data-v="1200.001300.001500.00">...</li>

我想要的是：

   <li class="item" data-v="1200.00">...</li>
   <li class="item" data-v="1300.00">...</li>
   <li class="item" data-v="1500.00">...</li>

帮助将不胜感激。

Answer 1

问题是因为您从所有 text()元素中检索.abc，然后将所有应用回{{1}元素。相反，你需要遍历它们中的每一个并单独执行逻辑，如下所示：

.item

$('.abc').each(function() {
  var $abc = $(this);
  var text = $abc.text().replace(/[^0-9\.]+/g, "");
  $abc.closest('.item').attr('data-v', text);
});

另请注意，除非您特别需要在DOM中提供<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <ul> <li class="item" data-v="1"> <div class="xyz" data-v="2"> <div class="abc" data-v="3">AED 12,00.00</div> </div> </li> <li class="item" data-v="1"> <div class="xyz" data-v="2"> <div class="abc" data-v="3">AED 13,00.00</div> </div> </li> <li class="item" data-v="1"> <div class="xyz" data-v="2"> <div class="abc" data-v="3">AED 15,00.00</div> </div> </li>属性，否则我建议您使用data-v，因为它的性能更高。

Answer 2

简单的解决方案如下：

    $('.abc').parents('.item').attr('data-v', function(){
return  $(this).text().replace(/[^0-9\.]+/g,"")
});

在相应的父数据元素中插入子文本

2 个答案: