简体   繁体   English

带有 javascript 的简单搜索引擎。 有什么建议吗?

[英]Simple search engine with javascript. Any suggestion?

I would to make a simple search engine with javascript.我想用 javascript 做一个简单的搜索引擎。 The idea is to read a server-side text file, parse it and find any expression that matches user's query.这个想法是读取服务器端文本文件,对其进行解析并找到与用户查询匹配的任何表达式。 And yes, I must use client-side scripting.是的,我必须使用客户端脚本。

Do you have any suggestion?你有什么建议吗?

Thanks.谢谢。

EDIT - Details to answer comments编辑 - 回答评论的详细信息

I need to parse 1 single file (max. 10.000 lines).我需要解析 1 个单个文件(最多 10.000 行)。 I do not need an auto-complete: I just want to display strings matching query in a SELECT element.我不需要自动完成:我只想在 SELECT 元素中显示字符串匹配查询。 Also, I would like to avoid using JQuery if possible.另外,如果可能的话,我想避免使用 JQuery。

You will have cross browser problems with the request so using a library that abstracts this IS a smart choice.您将在请求中遇到跨浏览器问题,因此使用抽象此库的库是一个明智的选择。 However here is a possible skeleton for the needed calls.然而,这里是所需调用的可能框架。

Be assured that storing a large file in a javascript variable is not very cleaver.请放心,将大文件存储在 javascript 变量中并不是很方便。 Beware on what you are doing!小心你在做什么!

var words = [];
var query = "";

function parseText(data) {
 // taking care of data
 // check null handle errors
 var data = data.replace(/\W+/g,' '); // replace non words with spaces
 words = data.split(' '); // split and cache this if you need it again without refetching
 doSearch(query);
}

function doSearch(query) {
  // handle the loop trough the array
  // you may save the data into a variable and use regex instead of splitting into an array
}

function handler() {
 if(this.readyState == 4 && this.status == 200) {
  // so far so good
  if(this.responseXML != null && this.responseXML != "")
     // success!
   parseText(this.responseXML);
  else
   parseText(null);
 } else if (this.readyState == 4 && this.status != 200) {
  // fetched the wrong page or network error...
  parseText(null);
 }
}

query = "someword";
var client = new XMLHttpRequest();
client.onreadystatechange = handler;
client.open("GET", "/remote.txt");
client.send();

If I understood you correctly you need autocomplete.如果我理解正确,您需要自动完成。 For jQuery I could recommend this one .对于 jQuery 我可以推荐这个

Some general recommendations:一些一般性建议:

  • If you don't want to use jQuery or similar libraries, use a (micro)library of your choice (eg. moo.ajax (disclaimer: I've never used this, no guarantees, yada yada)) to at least abstract the AJAX request for the textfile.如果您不想使用 jQuery 或类似库,请使用您选择的(微)库(例如moo.ajax (免责声明:我从未使用过这个,不保证,yada yada))至少抽象出AJAX 请求文本文件。 Don't be tempted to think it's trivial to write your own, and have it work cross-browser.不要认为编写自己的代码是微不足道的,并让它跨浏览器工作。
  • If you want to optimize for speed, use a trie or similar structure to keep track of the strings.如果您想优化速度,请使用trie或类似结构来跟踪字符串。 For 10,000 lines with reasonable entropy (ie not completely random data), the memory requirements for this hopefully aren't a problem.对于具有合理熵(即不是完全随机数据)的 10,000 行,memory 对此的要求希望不是问题。 You may want to ignore small queries (ie fewer than 3 characters or the like).您可能希望忽略小查询(即少于 3 个字符等)。
  • If you want to optimize for memory usage, only store the list of strings in memory as an array, and use a simple loop and indexOf or regular expression (keep in mind /foo/.test(str) is faster than str.match(/foo/) .) testing to get the list of matching strings.如果要针对 memory 的使用进行优化,只需将 memory 中的字符串列表存储为数组,并使用简单的循环和indexOf或正则表达式(请记住/foo/.test(str)str.match(/foo/) .) 测试以获取匹配字符串的列表。
  • Use innerHTML writing on the select element, and string concatenation to generate the <options> .在 select 元素上使用 innerHTML 书写,并使用字符串连接来生成<options> Manipulating thousands of DOM elements tends to be much slower.操作数以千计的 DOM 元素往往要慢得多。 Make sure to HTML escape the values, and be aware you may lose selected state (and scroll position) in the list, in case that is important for your application.确保 HTML 转义值,并注意您可能会丢失列表中选定的 state(和滚动位置),以防这对您的应用程序很重要。

Hope that helps!希望有帮助!

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM