使用 JS 从 html 表中的第一列搜索值?

2023-11-29

我有这张桌子

<th>Example No.</th>
<th>Column 1</th>
<tr>
<td id="SampleId">3512376894</td>
<td>[email protected]</td>
</tr>

我有一个脚本可以按所有列搜索值。但我想做的就是仅使用 td id 按第一列搜索值。但我不知道该怎么做。请帮我做到这一点?谢谢!

这是 jsfiddle 文件

这是 JScript:

function doSearch() {
        var searchText = document.getElementById('searchTerm').value;
        var targetTable = document.getElementById('dataTable');
        var targetTableColCount;
        for (var rowIndex = 0; rowIndex < targetTable.rows.length; rowIndex++) {
            var rowData = '';
            if (rowIndex == 0) {
                targetTableColCount = targetTable.rows.item(rowIndex).cells.length;
                continue; //do not execute further code for header row.
            }
            for (var colIndex = 0; colIndex < targetTableColCount; colIndex++) {
                rowData += targetTable.rows.item(rowIndex).cells.item(colIndex).textContent;
                if (rowIndex <= 1) {
                    document.getElementById('noresults').style.display = "block";
                }
            }
        }
    }

使用下面的代码片段在给定列中搜索特定术语。

<!-- HTML -->
<table id="dataTable">
  <th>Example No.</th>
  <th>Column 1</th>
  <th>Column  2</th>
  <tr>
    <td>345678917</td>
    <td>Test 1</td>
    <td>[email protected]</td>
  </tr>
  <tr>
    <td>3512376894</td>
    <td>Test 2</td>
    <td>[email protected]</td>
  </tr>  
</table>

// JavaScript
window.onload = function(){
  var term = "3512376894";                   // term you're searching for
  var column = 0;                            // which column to search
  var pattern = new RegExp(term, 'g');       // make search more flexible 
  var table = document.getElementById('dataTable');
  var tr = table.getElementsByTagName('TR');
  for(var i = 0; i < tr.length; i++){
    var td = tr[i].getElementsByTagName('TD');
    for(var j = 0; j < td.length; j++){
      if(j == column && td[j].innerHTML == term){

      // for more flexibility use match() function and the pattern built above
      // if(j == column && td[j].innerHTML.match(pattern)){

        console.log('Found it: ' + td[j].innerHTML);
      }
    }    
  }
};

Output:

Found it: 3512376894

工作中的jsBin or jsFiddle或者这个版本jsFiddle

版本4 | 版本5 | 版本6

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

使用 JS 从 html 表中的第一列搜索值? 的相关文章