Cet article décrit les différentes fonctions de recherche de JS pour implémenter les données de table. Il peut ignorer le cas, la recherche floue et plusieurs recherches de clés. Partagez-le pour votre référence. La méthode de mise en œuvre spécifique est la suivante:
Copiez le code comme suit: <! Doctype html>
<html>
<adal>
<meta charset = "utf-8">
<Title> </Title>
<script type = "text / javascript">
window.onload = function () {
var otab = document.getElementById ("tab");
var obt = document.getElementsByTagName ("entrée");
obt [1] .OnClick = function () {
pour (var i = 0; i <otab.tbodies [0] .Rows.length; i ++)
{
var str1 = otab.tbodies [0] .Rows [i] .Cells [1] .InnerHtml.toupperase ();
var str2 = obt [0] .value.toupperase ();
// Utilisez String.ToupperCase () (convertir tous les caractères de la chaîne en majuscules) ou string.tolowercase () (convertir tous les caractères dans la chaîne en minuscules)
// La soi-disant recherche pour ignorer les majuscules et les minuscules consiste à convertir toutes les chaînes entrées par l'utilisateur en majuscules ou en minuscules, puis convertir toutes les chaînes de la table d'information en majuscules ou en minuscules, et enfin comparer les caractères convertis des deux.
/ *********.
if (str1 == str2) {
otab.tbodies [0] .Rows [i] .style.background = 'red';
}
autre{
otab.tbodies [0] .Rows [i] .style.background = '';
}
/ ****************************** JS implémente la recherche floue des tables **************************** /
// La recherche floue du tableau consiste à utiliser une méthode Search () dans JS, en utilisant le format, String1.Search (String2);
// La chaîne entrée par l'utilisateur est une sous-chaîne, qui renverra la position de la sous-chaîne dans la chaîne principale. S'il ne correspond pas, il retournera -1. Par conséquent, l'opération est la suivante
if (str1.search (str2)! = - 1) {otab.tbodies [0] .rows [i] .style.background = 'red';}
else {otab.tbodies [0] .Rows [i] .style.background = '';}
/ *************.
// Recherchez plusieurs mots clés dans le tableau. Si vous ajoutez plusieurs mots clés entrés par l'utilisateur, utilisez la méthode de division pour diviser une longue chaîne en un tableau de chaîne avec des espaces comme standard.
// Comparez ensuite les sous-chaînes du tableau de coupe avec les chaînes du tableau d'information dans une boucle
var arr = str2.split ('');
pour (var j = 0; j <arr.length; j ++)
{
if (str1.search (arr [j])! = - 1) {otab.tbodies [0] .rows [i] .style.background = 'red';}
}
}
}
}
</cript>
</ head>
<body>
Nom: <entrée type = "Text" />
<input type = "bouton" value = "search" />
<table bordercolor = "bleu" id = "tab">
<adal>
<td> <h2> id </h2> </td>
<td> <h2> nom </h2> </td>
<td> <h2> Âge </h2> </td>
</ head>
<tbody>
<tr>
<td> 1 </td>
<TD> Blue </td>
<td> 15 </td>
</tr>
<tr>
<td> 2 </td>
<Td> Mikyou </td>
<td> 26 </td>
</tr>
<tr>
<td> 3 </td>
<td> faible </td>
<td> 24 </td>
</tr>
<tr>
<td> 4 </td>
<TD> Sky </td>
<td> 35 </td>
</tr>
<tr>
<td> 5 </td>
<td> li si </td>
<td> 18 </td>
</tr>
</tbody>
</ table>
</docy>
</html>
J'espère que cet article sera utile à la programmation JavaScript de tous.