javascript - 如何通过自定义属性获取另一个元素内元素内的文本

Question

我试图通过 JQuery 的父属性 (data-id) 获取元素的文本，但是，我无法获取它。

这是我到目前为止尝试过的:

function getNum() {
  return "1234asd";
}

function show() {
  console.log($("tr[data-id="+getNum()+"] > td > label").text());
  //Console should print "Text1"
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<table>
  <tr data-id="1234asd">
    <td>
      <label>Text1</label>
    </td>
    <td>
      <label>Text2</label>
    </td>
  </tr>
  <tr data-id="5678fgh">
    <td>
      <label>Text3</label>
    </td>
    <td>
      <label>Text4</label>
    </td>
  </tr>
</table>

<button onClick="show()">Click me</button>

我期待代码打印 Text1 但它什么也没打印(一个空字符串)。

Answer 1

您可以使用 Deepak Singh 提到的方法或者你可以使用 .first()的 JQuery

HTML

<table>
    <tr data-id="1234asd">
        <td>
            <label>Text1</label>
        </td>
        <td>
            <label>Text2</label>
        </td>
    </tr>
</table>
<button onClick="show()">Click me</button>

JS

function getNum() {
  return "1234asd";
}

function show() {
  console.log($("tr[data-id="+getNum()+"] td").first().text());
  //Console prints "Text1"
}