Datatables在表格中高亮显示搜索结果

最近在写一个WordPress主题的翻译系统，在词语展示中使用了datatables这个jQuery插件，因为以前使用过感觉这个插件的功能还是蛮强大的，尤其是实时搜索功能，在使用过程中向把实时搜索结果进行高亮显示，通过寻找官方文档终于找到解决方法。

官方的说明：https://datatables.net/blog/2014-10-22

解决方法

第一步：引入datatables的高亮显示插件，下载地址：http://bartaz.github.io/sandbox.js/jquery.highlight.js。前提是之前正确引入了datatables的相关文件，表格能正常显示。

第二步：添加样式，将样式添加到页面head或者样式表文件中。下面是我的样式，注意名称必须是highlight，否则不能正常显示

.highlight {
	color:red;
	border-bottom:1px dashed red;
	padding:2px;
}

第三步：定义js，下面是我的js文件部分

var wordstable = $('#words-table').DataTable({
		processing: true,
		responsive: true,
		fixedHeader: true,
		serverSide: true,
		ajax: {
			url: "./inc/get_data.php",
		},
		columns: [
			{ data: "wid" },
			{ data: "en" },
			{ data: "baidu" },
			{ data: "google" },
			{ data: "other" },
		],
		pageLength: 40,
});

//高亮显示控制
	wordstable.on('draw', function () {
		var tablebody = $(wordstable.table().body());
		tablebody.unhighlight();
		tablebody.highlight(wordstable.search());
	});

最后的效果