Recherche JSsearch de type Taobao (tutoriel détaillé)-js tutoriel-php.cn

Cet article fournit une analyse approfondie de l'utilisation de JSsearch en imitant la façon dont Taobao recherche des mots-clés puis extrait les recherches de produits associées

Nous donnons d'abord le code source pertinent du programme JSsearch : https://gitee.com/skyogo/JSsearch

Nous téléchargeons la version JSsearch1.0 Community

Après l'avoir téléchargée, nous téléchargeons une page d'achat similaire à Taobao

Ensuite, lorsque nous ouvrirons cette page, nous trouverons quelque chose comme ceci

À ce moment-là, nous fermons la page et copions notre JSsearch.js dans le répertoire racine de la page Taobao Après avoir copié

sous le dossier js, on l'introduit dans la page html (on l'écrit en bas du corps)

<script src="js/JSsearch.js"></script>
<script>
</script>

Copier après la connexion

Puis on l'ajoute à la ligne 76 ci-dessus (sous la balise d'entrée) et écrivons ce code

<p id="search-recommend">
 没有搜索结果
</p>

Copier après la connexion

Ensuite, nous ouvrons le fichier css/index.css et écrivons cette feuille de style CSS

#search-recommend{
  height: 40px;
  width: 580px;
  position: absolute;
  top: 110px;
  border: 1px gray solid;
  padding-left: 20px;
  box-sizing: border-box;
  padding-top: 11px;
  font-size: 15px;
  cursor: pointer;
  background: white;
}

Copier après la connexion

Exécutons la page html et find Il y a une case supplémentaire sous le champ de recherche