Javascript 如何为搜索高位词Jquery DataTable应用背景色

我有一个网格视图控件，列中有用于搜索的标题html文本框。当我搜索网格视图项时，我需要为其应用颜色。如何为搜索词应用颜色

我的代码：

<asp:TemplateField HeaderText="Element" Visible="true" HeaderStyle-Width="30%" ItemStyle-Width="30%">
                                    <HeaderTemplate>
                                        Speciality<br><input name="DynamicTextBox" id="txtElement" type="text" style="width: 120px" placeholder="Search Speciality" />
                                    </HeaderTemplate>
                                    <ItemTemplate>
                                        <asp:Label ID="lblElement" runat="server" Text='<%#Bind("Element") %>'></asp:Label>
                                    </ItemTemplate>
                                </asp:TemplateField> 



    <script>       
            $(document).ready(function () {
                $('#<%=GridView1.ClientID %>').hide();
                var values = eval('<%=Values%>');
                var InfoVal = localStorage.getItem("Info");            
                DataTable();
                SearchValue(values);
                $('#<%=GridView1.ClientID %>').show();
            });
            function bindDataTable(value) {

                $('#<%=GridView1.ClientID %> th').each(function () {
                    var title = $(this).text();
                    if (title == "Name" || title == "PName" || title == "Element") {
                        if (title == "Name"  || title == "PName") {
                            title1 = title.replace(" ", "");
                        }
                        if (title == "Element") {
                            title1 = title;
                        }
                        $(this).html(title + '<br/><input  name = "DynamicTextBox" id="txt' + title1 + '" type="text" style="width:120px" placeholder="Search ' + title + '" />');
                    }
                    else {
                        $(this).html(title + '<br/><br/>  ');
                    }
                });
            };
            var table;
            function DataTable() {
                table = $('#<%=GridView1.ClientID %>').prepend($('<thead></thead>').append($('#<%=GridView1.ClientID %>').find('tr:first'))).DataTable({
                    "paging": true,
                    "ordering": false,
                    "info": false,
                    "pageLength": 10,
                    "bLengthChange": false,
                });
                var PageVal = localStorage.getItem("PageNum");
                if (PageVal == null) {
                    PageVal = 0;
                }
                if (PageVal >= 1) {
                    PageVal = PageVal - 1;
                }
                if (PageVal == "") {
                    PageVal = 0;
                }


                table.page(PageVal).draw('page');            
                localStorage.removeItem("PageNum");
                table.columns().every(function () {
                    var that = this;
                    $('input', this.header()).on('keyup change', function () {
                        if (that.search() !== this.value) {
                            that
                                .search(this.value).draw();
                        }
                    });
                });

            };
            function SearchValue(values) {
                if (values != null || values != "") {
                    if (typeof values !== "undefined") {
                        var i = values[0];
                        $('#txtElement').val(i);
                        var j = values[1];
                        $('#txtName').val(j);
                        var k = values[2];
                        $('#txtName').val(k);

                        table.columns().every(function () {
                            var that = this;
                            $('input', this.header()).load('keyup change', function () {
                                if (that.search() !== this.value) {
                                    that
                                        .search(this.value).draw();
                                }
                            });
                        });
                    }
                }
            };


            var idClicked;
            $(function () {
                $('#<%=TextBoxContainer.ClientID %>').click(function (e) {
                    idClicked = "Clicked";
                    var info = table.page.info();
                    var currPag = info.page + 1;
                    var All = info.pages;

                    if (currPag != 0 || currPag <= All) {
                        localStorage.setItem("PageNum", "");
                        localStorage.setItem("PageNum", currPag);
                        localStorage.setItem("Info", "Clicked");
                    }
                });
            });

        </script> 

专业

$（文档）.ready（函数（）{
$（'#'）。隐藏（）；
var值=评估值（“”）；
var InfoVal=localStorage.getItem（“Info”）；
DataTable（）；
搜索值（值）；
$（'#'）。show（）；
});
函数bindDataTable（值）{
$（'#th'）。每个（函数（）{
var title=$（this.text（）；
if（title==“Name”| | title==“PName”| | title==“Element”）{
if（title==“Name”| | title==“PName”）{
title1=title.replace（“，”）；
}
如果（标题==“元素”）{
标题1=标题；
}
$（this.html（title+'
'）；
}
否则{
$（this.html（title+'

'）；
}
});
};
var表；
函数DataTable（）{
table=$（'#'）.prepend（$（''）.append（$（'#'）.find（'tr:first'））.DataTable({
“分页”：正确，
“命令”：错误，
“信息”：错误，
“页面长度”：10，
“bLengthChange”：false，
});
var PageVal=localStorage.getItem（“PageNum”）；
如果（PageVal==null）{
PageVal=0；
}
如果（PageVal>=1）{
PageVal=PageVal-1；
}
如果（PageVal==“”）{
PageVal=0；
}
表.页码（PageVal）.draw（'页码'）；
localStorage.removietem（“PageNum”）；
table.columns（）.every（函数（）{
var=这个；
$（'input'，this.header（））.on（'keyup change'，function（）{
if（that.search（）！==此.value）{
那个
.search（this.value）.draw（）；
}
});
});
};
函数SearchValue（值）{
如果（值！=null | |值！=“”）{
如果（值的类型！=“未定义”）{
var i=数值[0]；
$（'#txtElement'）.val（i）；
var j=数值[1]；
$（'#txtName'）.val（j）；
var k=数值[2]；
$（'#txtName'）.val（k）；
table.columns（）.every（函数（）{
var=这个；
$（'input'，this.header（））.load（'keyup change'，function（）{
if（that.search（）！==此.value）{
那个
.search（this.value）.draw（）；
}
});
});
}
}
};
var-idc；
$（函数（）{
$（'#'）。单击（函数（e）{
idClicked=“Clicked”；
var info=table.page.info（）；
var currPag=info.page+1；
var All=info.pages；
如果（currPag！=0 | | currPag，这里有一个小例子说明如何操作


var text=$（“#textBox”）.html（）；
var word=“it”；
var wordRegExp=newregexp（“it”、“gi”）；
text=text.replace（wordRegExp，“+word+”）；
$（“body”）.html（文本）；
。突出显示{
背景：黄色；
}

Lorem Ipsum仅仅是印刷和排版行业的虚拟文本。自16世纪以来，Lorem Ipsum一直是该行业的标准虚拟文本，当时一位不知名的印刷商拿起一个打印工具，争先恐后地制作了一本字体样本书。它不仅存活了五个世纪，而且还跨越到了电子排版，仍然是埃森理论上没有变化。它在20世纪60年代随着包含Lorem Ipsum段落的Letraset表单的发布而流行，最近随着桌面出版软件（如Aldus PageMaker）包括Lorem Ipsum版本而流行。
找到单词后添加样式？嗨@Interactive，请告诉我怎么做Hi@Abdelaziz Mokhnache，我如何应用我的代码请告诉我你的答案。我把
放在哪里肯定不会像现在这样工作。你必须用搜索结果容器和
单词的
id
替换
#textBox
与您正在搜索的单词。我找不到该单词所在的位置，因此我请求您帮助我。我想更改为我的代码我是一名javascript开发人员。很抱歉，我无法理解您的asp代码。搜索功能对您是否正常工作？我正在使用搜索功能以及
标记前端中的所有内容。您的代码将正常工作但是我的代码搜索元素值我没有找到这是我的问题谢谢