根据第一个单元格内容获取表格单元格值

时间:2017-10-05 11:19:25

标签: javascript

我有一个包含多个动态表的页面,其中一个表格看起来像下面的结构

Col1 Col2 Col3
1    One  Two
2    b    15/12/2017
3    a    X
2    W    10/12/2014

HTML

<table id="table1">
<tbody>
<tr>
<th>Col1</th>
<th>Col2</th>
<th>Col3</th>
</tr>
<tr> <td>1</td>
     <td>b</td>
     <td>15/12/2017</td>
</tr>
<tr> <td>2</td>
     <td>b</td>
     <td>15/10/2017</td>
</tr>

<tr> <td>3</td>
     <td>b</td>
     <td>15/09/2017</td>
</tr>
</tbody>
</table>

我想知道如何根据col3的值,使用标题名称在col1中获取单元格?

EX:

我希望按ID找到该表,并检查每行的第一个单元格,如果它等于2,则在同一行中获取col 3的单元格值!

任何帮助都将得到充分的赞赏

2 个答案:

答案 0 :(得分:2)

使用jQuery很容易;如果您已找到该单元格,请获取该行中的第三个单元格;

$('td') // Select all cells
.filter(function() { // Filter the cells
    return $(this).text() == '2';
})
.closest('tr') // get the table row
.find('td') // select all cells in that row
.eq(2) // select the third cell (0-based index)
.text(); // this will output '15/12/2017'

编辑我今天心情愉快,请查看这个小小的演示; https://jsfiddle.net/a32knb81/。只需在输入字段中输入搜索关键字,即可获得同一行中第三列的值。

答案 1 :(得分:2)

您可以尝试使用jquery,例如下面的代码段。

更新:您可以使用$('th:contains("col3")').index()

按表格标题获取特定列

&#13;
&#13;
$(document).ready(function() {
  $('#myTable').find('tbody td:first-child').each(function() {
    if ($(this).text() == '2') {
      console.log($(this).closest('tr').find('td').eq($('th:contains("col3")').index()).text());
    }
  });
});
&#13;
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table id="myTable">
  <thead>
    <th>col1</th>
    <th>col2</th>
    <th>col3</th>
  </thead>
  <tbody>
    <tr>
      <td>1</td>
      <td>one</td>
      <td>ONE</td>
    </tr>
    <tr>
      <td>2</td>
      <td>two</td>
      <td>TWO</td>
    </tr>
    <tr>
      <td>3</td>
      <td>three</td>
      <td>THREE</td>
    </tr>
  </tbody>
</table>
&#13;
&#13;
&#13;