Question

我想从.text s与类.val之间的某些<td>中获取<tr>或.ccc并将其放入数组中。

<tr class="ccc">
   <td>Strategy & Performance</td>
   <td class="l_ccc_data" id="Foo~Q_1"></td> //the innerHTML of this should read 10
   <td class="l_ccc_data" id="Foo~Q_2"></td> //the innerHTML of this should read 12
</tr>
<tr class="inner">
   <td id="Bar~Q_1">5</td>
   <td id="Bar~Q_2">6</td>
</tr>
<tr class="inner">
   <td id="Something~Q_1">5</td>
   <td id="Something~Q_2">6</td>
</tr>
<tr class="ccc">
   <td>Central Engineering</td>
   <td class="l_ccc_data" id="Boo~Q_1">Next total Goes here</td>
   etc...

到目前为止，我对脚本的所作所为：

$(document).ready(function(){
    $('.l_ccc_data').each(function(){
        var id = $(this).attr('id');
        var arr_id = id.split('~');
        var q = arr_id[1];
        var arr_sum = [];
        arr_sum.push($(this).nextUntil('.ccc', '[id$="+q+"]').html()); //this could be .text(), or .val(), not sure
        //then add up all the values in arr_sum and set
        //$(this).html(whatever the sum);
    });
});

我知道将数据编码到ID中是一个坏主意，目前它无法真正得到帮助。我需要从任何<td>获取以相同的Q_1或Q_2结尾的值，或者使用类<td>获取l_ccc_data的值<td>。然后我需要获取该数字，将其推送到数组，添加它们，然后将其显示在l_ccc_data的innerhtml中，并使用类file。一个简单的总计。不应该这么难，但我觉得我错过了什么。

这是nextUntil的正确用法吗？我做错了什么？

Answer 1

nextUntil方法仅查看下一个兄弟节点，而不是下一个可能具有不同父节点的节点。

因此，您需要在DOM树的上一层，从当前td到父tr，然后应用nextUntil。然后你需要再次下载，你可以使用find。

请注意，我也纠正了一些错误（例如'[id$="+q+"]'中的错误引用导致+无法按预期运行）。请注意，您不应使用html()来放置纯文本。请使用text()。

$(function(){
    $('.l_ccc_data').each(function(){
        var q = $(this).attr('id').split('~').pop();
        var sum = 0;
        $(this).parent().nextUntil('.ccc').find('[id$="'+q+'"]')
               .each(function () {
                    sum += +$(this).text();
               });
        $(this).text(sum);
    });
});

Answer 2

简单的querySelectorAll电话会很好地解决这个问题：

＆＃13;

var elements = document.querySelectorAll('.ccc > .l_ccc_data');

var texts = Array.prototype.map.call(elements, function(element) {
  return element.innerText;
})

console.log(texts) // ["Total Needs to go here", "Total Needs to go here"]

＆＃13;

<table>
  <tr class="ccc">
    <td>Strategy & Performance</td>
    <td class="l_ccc_data" id="Foo~Q_1">Total Needs to go here</td>
    <td class="l_ccc_data" id="Foo~Q_2">Total Needs to go here</td>
  </tr>
  <tr class="inner">
    <td id="Bar~Q_1">Some number I need</td>
    <td id="Bar~Q_2">Some number I need</td>
  </tr>
  <tr class="inner">
    <td id="Something~Q_1">Some other number I need</td>
    <td id="Something~Q_2">Some number I need</td>
  </tr>
</table>

＆＃13;

我可以使用nextUntil来获取这些值吗？

2 个答案: