如何突出显示数据表单个搜索文本？

Question

我想在不使用数据表突出显示js的情况下突出显示搜索文本。我正在使用Datatable个人列搜索API。 但我想尝试一些不同的东西。任何建议将不胜感激。

我知道：Datatable highlight js

$('.text-inputs-searching thead th').each( function () {
    var title = $(this).text();
    $(this).html( '<input type="text" placeholder=" '+title+'" />' );
} );
$('.text-inputs-searching tfoot th').each( function () {
    var title = $(this).text();
    $(this).html( '<input type="text" placeholder=" '+title+'" />' );
} );

// DataTable
var tableSearching = $('.text-inputs-searching').DataTable({
        dom: 'Bfrtip',
        paging: false,
        scrollX: true,
        // retrieve: true,
        searchHighlight: true,
        processing: true,
        // serverSide: true,
        // ajax: "server_side.php",
        buttons: [
            'copy', 'excel', 'print'
        ]
    });

  // $('.text-inputs-searching tbody').on('click', 'tr', function () {
  //       var data = tableSearching.row( this ).data();
  //       alert( 'You clicked on '+data[0]+'\'s row' );
  //   } );

    $('.buttons-copy, .buttons-print, .buttons-excel').addClass('btn btn-raised gradient-crystal-clear white shadow-big-navbar mr-1');

// Apply the search
tableSearching.columns().every( function () {
    var that = this;

    $( 'input', this.header() ).on( 'keyup change', function () {
        if ( that.search() !== this.value ) {
            that
                .search( this.value )
                .draw();
        }
    } );
} );

tableSearching.columns().every( function () {
    var that = this;

    $( 'input', this.footer() ).on( 'keyup change', function () {
        if ( that.search() !== this.value ) {
            that
                .search( this.value )
                .draw();
        }
    } );
} );