选择HTML表行上的语句

时间:2017-06-22 14:07:48

标签: javascript html5

所以我想说我有一个HTML表格

|VENDOR|ITEM|TOTAL|
|BNB|ITEM1|1000|
|BNB|ITEM2|250|
|XZY|ITEM2|600|
|BNB|ITEM3|1000|
|XZY|ITEM1|300|

我需要做的是一个类似于sql

的select语句
SELECT * WHERE VENDOR = 'BNB';

它应该返回

|VENDOR|ITEM|TOTAL|
|BNB|ITEM1|1000|
|BNB|ITEM2|250|
|BNB|ITEM3|1000|

我不想通过for循环运行,因为当我们有50000多行需要很长时间时,我必须在供应商列表中运行for循环。所以100个供应商每次运行50000行。你可以看到问题。

3 个答案:

答案 0 :(得分:1)

最后你需要以某种方式循环。使用行上的数据属性可以让您使用带有querySeectorAll的CSS选择器来获取所需的项目。

#details.filter tbody tr {
   display:none;
}

#details.filter tbody tr.active {
   display: table-row;
}
<select id="sel">
  <option value=""></option>
  <option value="A">A</option>
  <option value="B">B</option>
  <option value="C">C</option>
</select>

<table id="details">
  <thead>
    <tr><th>Vend</th></tr>    
  </thead>
  <tbody>
    <tr data-vendor="A"><td>A-1</td></tr>
    <tr data-vendor="A"><td>A-2</td></tr>
    <tr data-vendor="A"><td>A-3</td></tr>
    <tr data-vendor="A"><td>A-4</td></tr>
    <tr data-vendor="B"><td>B-1</td></tr>
    <tr data-vendor="B"><td>B-2</td></tr>
    <tr data-vendor="B"><td>B-3</td></tr>
    <tr data-vendor="C"><td>C-1</td></tr>
  </tbody>
</table>
for i in df.files:
    count = 0
    if len(i) == 0:
        count = count + 1
    else:
        pass

答案 1 :(得分:0)

您不得在加载时显示完整的50k结果。必须将其设置为none。这样它将在合理的时间内加载。

解决方案非常简单,您只需为行上的每个供应商添加一个类。然后你可以用jquery选择这个类来显示。

$('tr').hide();
$('.specific-vendor').show();

答案 2 :(得分:0)

所以@epascarello帮助提出了一个想法,所以我需要给予他信任。这不是我需要的,但让我走上正轨。

所以我在后台做的是。

 proddb.each("SELECT * FROM table_a", function (DBRow) {

        var row = document.createElement("tr");
        /////////////////////////////////////////
        cell = document.createElement("td");
        cell.innerHTML = DBRow.col1;
        row.appendChild(cell);
        /////////////////////////////////////////
        cell = document.createElement("td");
        cell.innerHTML = DBRow.col2;
        row.appendChild(cell);


        //add queries
        row.dataset.table_a_col1= DBRow.col1;
        row.dataset.table_a_col2= DBRow.col2;

        //end queries

        html_table_name.appendChild(row);
    });

现在在后端我可以像这样访问

    var tablerow= document.querySelectorAll('tr[data-table_a_col1="' + searchvalue + '"]');
    for (var ii = 0; ii < tablerow.length; ii++) {

        if (tablerow[ii].cells[21].innerHTML == "1") {
            //do the stuff here.
        }
    }

这已经将行数从50000减少到361,这已经加快了很多,感谢所有的帮助。

@epascarello如果你可以复制这个作为你的答案,并给我一些信用,并接受答案,谢谢你的一切萌芽。