是否有可以确定字符串是否与搜索查询匹配的 JavaScript 库？它应该是高效的，并提供类似于 Google 或 LexisNexis 的高级查询功能（诸如和/或运算符、同义词和括号之类的东西）。任何一种高级搜索功能都会很棒；它不必与任何特定的搜索引擎完全匹配。
动机：我有一个带有搜索框的 HTML 页面，后跟一堆段落（它们具有唯一的 id，并且是从 JavaScript 数组生成的）。当用户在框中键入搜索查询并按 Enter 键时，如果所有段落与查询不匹配，则应隐藏所有段落（即它们的display设置为）。none
我目前的策略（使用 jQuery）：
$('p').hide()。$('p:contains("'+keyword+'")').show()。这是一个非常有限的搜索功能，它区分大小写，将所有关键字视为可选关键字，并且不提供诸如 、 或括号之类的运算and符or。这也是低效的，因为它为每个关键字遍历每个字符串一次，即使它已经匹配。
以下是我正在为项目评估的一些库（2013 年 7 月）。其中任何一个都应该能够提供搜索功能的核心。
如果您想自己构建，这里有 2 种常见的词干提取算法的实现，可以帮助您入门：
至于处理布尔逻辑搜索运算符，也许这个关于 js 查询解析器的问题会很有用。
最好的（简单而好的）方法是使用向量搜索算法。
首先取每个段落中的所有单词并将它们保存在一个向量对象中（如何构建稍后解释）并比较每个段落向量的查询向量的关系
然后在每个单词上使用Porter 词干分析器将其聚集在一起，例如孩子和孩子。
var Vector = function(phar) {
var self = this;
self.InitVector = function () {
var wordArray = self.spltwords(phar);
self.VectorSize = wordArray .length;
var stemdWordArray = self.runPotterStemmer(wordArray);
self.VectoData = self.GroupAndCountWords(stemdWordArray) ;
}
self.VectoData = {};
self.runPotterStemmer = function(arr){
// run potter as seen in link
}
self.spltwords= function(arr) {
// run split
}
self.GroupAndCountWords = function(arr) {
for (var i=0; i<arr.length; i++) {
if (VectoData[arr[i]] === undefined) {
VectoData[arr[i]] = 0;
} else {
VectoData[arr[i]] = VectoData[arr[i]] +1;
}
}
}
self.compare = function(queryVector) {
// compare queryVector to current vector and return a similarity number
// number of similar words count in query divided by the length of paragraph
}
self.InitVector()
return self;
免责声明 - 我是作家。
你也可以试试 ItemsJS。这是一个支持全文、分面和排序的 JavaScript 搜索引擎。
您将在下面找到一个交互式示例 - ItemsJS + VueJS：
var configuration = {
searchableFields: ['title', 'tags', 'actors'],
sortings: {
name_asc: {
field: 'name',
order: 'asc'
}
},
aggregations: {
tags: {
title: 'Tags',
size: 10
},
actors: {
title: 'Actors',
size: 10
},
genres: {
title: 'Genres',
size: 10
}
}
}
// the rows comes from external resources
// https://github.com/itemsapi/itemsapi-example-data/blob/master/jsfiddle/imdb.js
itemsjs = itemsjs(rows, configuration);
var vm = new Vue({
el: '#el',
data: function () {
// making it more generic
var filters = {};
Object.keys(configuration.aggregations).map(function(v) {
filters[v] = [];
})
return {
query: '',
// initializing filters with empty arrays
filters: filters,
}
},
methods: {
reset: function () {
var filters = {};
Object.keys(configuration.aggregations).map(function(v) {
filters[v] = [];
})
this.filters = filters;
this.query = '';
}
},
computed: {
searchResult: function () {
var result = itemsjs.search({
query: this.query,
filters: this.filters
})
return result
}
}
});<script src="https://cdn.rawgit.com/itemsapi/itemsapi-example-data/master/jsfiddle/imdb.js"></script>
<script src="https://cdn.rawgit.com/itemsapi/itemsjs/master/dist/itemsjs.js"></script>
<script src="https://cdn.jsdelivr.net/vue/latest/vue.min.js"></script>
<link href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.0.0/css/bootstrap.min.css" rel="stylesheet"/>
<div id="el">
<nav class="navbar navbar-default navbar-fixed-top">
<div class="container">
<div class="navbar-header">
<a class="navbar-brand" href="#" v-on:click="reset()">ItemsJS movies</a>
</div>
<div id="navbar">
<form class="navbar-form navbar-left">
<div class="form-group">
<input type="text" v-model="query" class="form-control" placeholder="Search">
</div>
</form>
</div><!--/.nav-collapse -->
</div>
</nav>
<div class="container" style="margin-top: 50px;">
<h1>List of items ({{ searchResult.pagination.total }})</h1>
<p class="text-muted">Search performed in {{ searchResult.timings.search }} ms, facets in {{ searchResult.timings.facets }} ms</p>
<div class="row">
<div class="col-md-2 col-xs-2">
<div v-for="facet in searchResult.data.aggregations">
<h5 style="margin-bottom: 5px;"><strong style="color: #337ab7;">{{ facet.title }}</strong></h5>
<ul class="browse-list list-unstyled long-list" style="margin-bottom: 0;">
<li v-for="bucket in facet.buckets">
<div class="checkbox block" style="margin-top: 0; margin-bottom: 0;">
<label>
<!--<input class="checkbox" type="checkbox" v-on:click="updateFilters(facet.name, bucket.key)" v-model="filters[bucket.key]" value="{{ bucket.key }}" v-bind:value="isChecked2()">-->
<!--<input class="checkbox" type="checkbox" v-on:click="updateFilters(facet.name, bucket.key)" v-model="filters[bucket.key]" v-bind:value="bucket.key">-->
<input class="checkbox" type="checkbox" v-model="filters[facet.name]" v-bind:value="bucket.key">
{{ bucket.key }} ({{ bucket.doc_count }})
</label>
</div>
</li>
</ul>
</div>
</div>
<div class="col-md-10 col-xs-10">
<div class="breadcrumbs"></div>
<div class="clearfix"></div>
<!--<h3>List of items ({{ searchResult.pagination.total }})</h3>-->
<table class="table table-striped">
<tbody>
<tr v-for="item of searchResult.data.items">
<td><img style="width: 100px;" v-bind:src="item.image"></td>
<td></td>
<td>
<b>{{ item.name }}</b>
<br />
{{ item.description }}
</td>
<td></td>
<td>
<span style="font-size: 12px; display: block; float: left; background-color: #dbebf2; border-radius: 5px; padding: 1px 3px 1px 3px; margin: 2px;" v-for="tag in item.tags">{{ tag }}</span>
</td>
</tr>
</tbody>
</table>
<div class="clearfix"></div>
</div>
<div class="clearfix" style="margin-bottom: 100px;"></div>
</div>
</div>
</div>我在搜索和 NLP 领域从事过一些开源 javascript 项目。您可以结帐search-index似乎接近您正在寻找的东西。
PEG.js 和 boolean-search.js 都是获取一些解析库的有用库。
https://www.npmjs.com/package/boolean-parser
https://www.npmjs.com/browse/keyword/lucene
希望有帮助。