javascript - jQuery - 关闭 anchor 标记后获取文本

Question

我有一个像这样的表:

<table border="1" width="40%">
   <tbody>
      <tr class="child-row123" style="display: table-row;">
         <td class="monsters">Monster</td>
         <td class="monsters">
            <a data-name="Megalosmasher X" target="_blank">Megalosmasher X</a> x3<br>
            <a data-name="Danger! Nessie!" target="_blank">Danger! Nessie!</a> x2<br>
            <a data-name="Kuriboh" target="_blank">Kuriboh</a> x1<br>
            <a data-name="Dark Magician" target="_blank">Dark Magician</a> x3<br>
         </td>
      </tr>
   </tbody>
</table>

我目前正在使用 jquery get 从 data 中提取所有名称。属性。 但是，我还需要查看它被引用的次数(x3、x2 或 x1)，它们是独立的文本节点。

这是我的循环:

jQuery(".child-row123 a[data-name]").each(function(){
    var dataname = jQuery(this).data('name');

    //Alert
    if(!jQuery.isNumeric(dataname)){
        alert(dataname);  
    }
});

使用 jQuery，是否可以获取 x3、x2 或 x1 文本节点旁边的数据名称？我正在尝试从逻辑上弄清楚它，我猜我需要查看每个 anchor 标记的末尾？

Answer 1

尝试使用 DOM 函数 .nextSibling 选取下一个节点并使用 nodeValue 获取“引用的(x3、x2 或 x1)”

来源:How to get text node after element?

jQuery(".child-row123 a[data-name]").each(function() {
  var dataname = jQuery(this).data('name');
  var nodetext = jQuery(this)[0].nextSibling.nodeValue;

  //Alert
  if (!jQuery.isNumeric(dataname)) {
    console.log("Data: " + dataname + "\nreferenced: " + nodetext);
  }
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<table border="1" width="40%">
  <tbody>
    <tr class="child-row123" style="display: table-row;">
      <td class="monsters">Monster</td>
      <td class="monsters">
        <a data-name="Megalosmasher X" target="_blank">Megalosmasher X</a> x3<br>
        <a data-name="Danger! Nessie!" target="_blank">Danger! Nessie!</a> x2<br>
        <a data-name="Kuriboh" target="_blank">Kuriboh</a> x1<br>
        <a data-name="Dark Magician" target="_blank">Dark Magician</a> x3<br>
      </td>
    </tr>
  </tbody>
</table>