訪問不同類型的元素

Question

我有幾排桌子。 每行都有標題，數據和隱藏字段。 數據列可以具有文本或文本區域。

<table id="knowledgeTreeTable" class="custom">
<tbody>
  ....................
  <tr>
     <th class="">What is the name of the party?</th>
     <td class="">
        <textarea id="ktField_7" class="ktEdit" type="text"></textarea>
     </td>
     <input id="ktField_7H" type="hidden" value="Unique contested">
  </tr>
  <tr>
     <th class="">What is the name of the opposing party?</th>
     <td class="">
        <input id="ktField_8" class="ktEdit" type="text" style="width: 97%;">
     </td>
     <input id="ktField_8H" type="hidden" value="Query">
  </tr>
  ......................
</tbody>
</table>

我能夠讀取標頭和隱藏字段的內容，但不確定如何讀取數據列，因為它可以具有兩種不同類型的元素。

$("#knowledgeTreeTable tr").each(function() {
        alert($('th', this).text());//OK
        //alert($('td > [input, textarea]', this).val()); // This is not OK.
        alert($('input', this).val());//OK
    });

Answer 1

您不能將選擇器分組

td > [input, textarea]

相反，使用

td > input, td > textarea

Answer 2

就像在CSS選擇器中一樣，請同時查找以下兩者 ：

alert($('td > input, td > textarea', this).val()); 

盡管由於您對兩者都使用相同的類，所以我傾向於使用：

alert($('td > .ktEdit', this).val()); 

Answer 3

每當您試圖在這樣的循環中訪問子元素時，都需要確定每個元素之間的共同因素。 在這種情況下，它們是具有不同名稱的不同標記，但是它們都具有ktEdit類，並且都具有type="text" （我認為實際上不適用於textareas）。

在這種情況下，公共變量是類名，因此您可以將其用作選擇器。 只要您正確地確定了父循環的目標，就可以在整個頁面的其他元素上使用該類：

$("#knowledgeTreeTable tr").each(function() {
    alert($('.ktEdit', this).val());
});