Heim > Web-Frontend > js-Tutorial > Hauptteil

Detaillierte Erläuterung der js-Implementierung der Front-End-Fuzzy-Abfrage

小云云
Freigeben: 2018-03-15 15:43:17
Original
2113 Leute haben es durchsucht

Bei Fuzzy-Abfragen werden Schlüsselwörter im Allgemeinen an das Backend übergeben, und das Backend erledigt dies. Aber manchmal können einige leichtgewichtige Listen-Frontends Ajax-Anfragen reduzieren und die Benutzererfahrung bis zu einem gewissen Grad verbessern. Kommen wir ohne weitere Umschweife direkt zum Code.

//字符串方法indexOf
var len = list.length;
var arr = [];
for(var i=0;i<len;i++){
    //如果字符串中不包含目标字符会返回-1
    if(list[i].indexOf(keyWord)>=0){
        arr.push(list[i]);
    }
}
return arr;
Nach dem Login kopieren
//正则表达式
var len = list.length;
var arr = [];
var reg = new RegExp(keyWord);
for(var i=0;i<len;i++){
    //如果字符串中不包含目标字符会返回-1
    if(list[i].match(reg)){
        arr.push(list[i]);
    }
}
return arr;
Nach dem Login kopieren

Zunächst müssen Sie verstehen, was eine Fuzzy-Abfrage ist (wieder Unsinn), nämlich die Auflistung der Schlüsselwörter in der Liste basierend auf den Schlüsselwörtern (von Dies geschieht hier natürlich nur am einfachsten), dh es wird überprüft, ob jedes Element in der Liste ein Schlüsselwort enthält. Abstrakt bedeutet es also, ob eine Zeichenfolge ein bestimmtes Zeichen oder eine bestimmte Zeichenfolge enthält.

Da wir nun eine Idee haben, besteht der nächste Schritt darin, sie zu implementieren. Wenn wir die grundlegenden Datentypen von js lernen, werden wir feststellen, dass es viele Methoden gibt die Methode string.indexOf(''); diese Methode besteht darin, die Position eines bestimmten Zeichens in der Zeichenfolge zu ermitteln. Wenn kein Zielzeichen vorhanden ist, wird -1 zurückgegeben. Mit dieser Methode können wir also prüfen, ob jedes Element in der Liste ein Schlüsselwort enthält. Als nächstes kommt der sehr leistungsstarke RegExp, ein regulärer Ausdruck zum Abgleichen des Zielzeichens einer Zeichenfolge. Wenn er nicht übereinstimmen kann, gibt er natürlich mehrere andere Methoden zurück, die implementiert werden können werden hier nicht aufgeführt.

Verwandte Empfehlungen:

Eingabebasierte dynamische Fuzzy-Abfrage

JS-Front-End-Implementierungscode für Fuzzy-Abfragen

So implementieren Sie Fuzzy-Abfragen in PHP

Das obige ist der detaillierte Inhalt vonDetaillierte Erläuterung der js-Implementierung der Front-End-Fuzzy-Abfrage. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage
Über uns Haftungsausschluss Sitemap
Chinesische PHP-Website:Online-PHP-Schulung für das Gemeinwohl,Helfen Sie PHP-Lernenden, sich schnell weiterzuentwickeln!