Question

在jquery中，我们可以使用this和nextAll选择特定元素的所有下一个同级。

我正在尝试在javascript.中采用这种方法，例如，在以下示例中，我单击nth child(n) td。现在，我需要选择之后的所有同级，而不是所有的同级（之前和之后）。

假设内容直到20行都可以，现在我想将内容从21或任何特定的子对象复制到其下一个同胞中，如何复制？

但是在这里，仅复制了第一行的值。

nextElementSibling表示在该元素之后的兄弟姐妹，不是吗？

window.onload=function(){
  fee_cpy();
}

function fee_cpy(){
    document.getElementById("cpy").addEventListener("click", function(){
        document.querySelectorAll('.fee_td').forEach(function (element, index) {
            var amnt =  parseInt(element.innerHTML);
            var tr = element.closest('tr');
            while (tr = tr.nextElementSibling){
                tr.querySelector('.fee_td').innerHTML = amnt;
            }
        })      
    })
}

<html>
  <head>
  </head>
  <body>
    <button id='cpy'>COPY</button>
    <table>
      <tr>
        <th>Item</th><th>Rate</th>
      </tr>
      <tr>
        <th>Item.1</th>
        <td contenteditable class='fee_td'></td>
      </tr>
      <tr>
        <th>Item.2</th>
        <td contenteditable class='fee_td'></td>
      </tr>
      <tr>
        <th>Item.3</th>
        <td contenteditable class='fee_td'></td>
      </tr>
      <tr>
        <th>Item.4</th>
        <td contenteditable class='fee_td'></td>
      </tr>
      <tr>
        <th>Item.5</th>
        <td contenteditable class='fee_td'></td>
      </tr>
      <tr>
        <th>Item.6</th>
        <td contenteditable class='fee_td'></td>
      </tr>
    </table>
  </body>
</html>

JavaScript nextall兄弟元素

0 个答案: