纯前端实现模糊查询 或和且

js代码：

//onclick事件
function searchText() {
    var keyword = $("#search_text").val().trim();
    var keyword2 = keyword
    var keyword_pieces = keyword.split(/\s+/); //或
    var keyword_pieces2 = keyword2.split(/\s+&\s+/); //且

    var searchLen = $("#data_frame tr").length;
    // var searchAll=$("#data_frame tr td").text();
    if (keyword_pieces2.length < 2) {//或
        var searchLen = $("#data_frame tr").length;
        // var searchAll=$("#data_frame tr td").text();
        for (var i = 1; i < searchLen - 1; i++) {
            let searchText = $("#data_frame tr")[i].innerText;
            if (searchText.match(keyword)) {
                $("#data_frame tr")[i].style.display = '';
            } else {
                if (keyword_pieces.length > 1) {
                    var cnt = 0;
                    for (var j = 0; j < keyword_pieces.length; j++) {
                        keyword_piece = keyword_pieces[j];
                        if (searchText.match(keyword_piece)) {
                            cnt = 1;
                            $("#data_frame tr")[i].style.display = '';
                            break;
                        }
                    }
                    if (cnt === 0) {
                        $("#data_frame tr")[i].style.display = 'none';//不符合查询条件的当前数据隐藏
                    }
                } else {
                    $("#data_frame tr")[i].style.display = 'none';//不符合查询条件的当前数据隐藏
                }
            }
        }
    } else {//且
        var searchLen = $("#data_frame tr").length;
        // var searchAll=$("#data_frame tr td").text();
        for (var i = 1; i < searchLen - 1; i++) {
            let searchText = $("#data_frame tr")[i].innerText;
            if (searchText.match(keyword)) {
                $("#data_frame tr")[i].style.display = '';
            } else {
                var cnt = 1;
                for (var j = 0; j < keyword_pieces2.length; j++) {
                    if (!searchText.match(keyword_pieces2[j])) {
                        $("#data_frame tr")[i].style.display = 'none';//不符合查询条件的当前数据隐藏
                        cnt = 0;
                        break;
                    }
                }
                if (cnt === 1) {
                    $("#data_frame tr")[i].style.display = '';
                }
            }
        }
    }


}

$(function () {
    $("#search_text").keyup(function (event) {
        if (event.keyCode == 13) {
            $("#search_button").click();
        }
    });
})

html:

<input id="search_text" class="form-control" type="text" placeholder="搜索...">
<button hidden id="search_button" onclick="searchText()">搜索</button>
<table id="data_frame" class="table table-striped table-bordered second"
                                       style="width:100%">
                                    <thead>
                                    <tr>
                                        <th>标题</th>
                                        <th>时间</th>
                                    </tr>
                                    </thead>
                                    <tbody>
                                    <tr>
                                        <td><a href="#1">绍兴港上虞杭州湾港区液体化工码头工程全过程咨询服务</a></td>
                                        <td>2021-07-09</td>
                                    </tr>
                                    <tr>
                                        <td><a href="#2">2021 年嵊州市水库整治提升工程—三界镇王木水库</a></td>
                                        <td>2021-12-22</td>
                                    </tr>
                                    <tr>
                                        <td><a href="#3">新民片农民集中居住区（一期）建设项目施工监理</a></td>
                                        <td>2021-12-22</td>
                                    </tr>
                                    <tr>
                                        <td><a href="#4">L-41地块限价房场外工程</a></td>
                                        <td>2021-12-21</td>
                                    </tr>
                                    <tr>
                                        <td><a href="#5">新昌县天姥大桥-新中路连接线建设工程</a></td>
                                        <td>2021-12-21</td>
                                    </tr>
                                    </tbody>
                                    <tfoot>
                                    <tr>
                                        <th>标题</th>
                                        <th>时间</th>
                                    </tr>
                                    </tfoot>
                                </table>