Re: comment fait Google ? - discussions dans le groupe fr.comp.lang.javascript

Re: comment fait Google ?

Sujet: Re: comment fait Google ?

De: stephanemoriaux.NoAd...@wanadoo.fr.invalid (SAM)

Groupes: fr.comp.lang.javascript

Organisation: les newsgroups par Orange

Date: 06. Oct 2008, 09:36:19

References: 1 2 3 4 5 6 7

Le 10/6/08 4:21 AM, bpdu92 a écrit :
> On Fri, 03 Oct 2008 12:52:34 +0200, SAM
> <stephanemoriaux.NoAdmin@wanadoo.fr.invalid> wrote:
> 
> 
>> Il faudrait savoir ce que tu veux faire exactement.
> pas faire, mais plus modestement comprendre
> 1-le source de la page Google
> 2-comment est réalisé l'asynchronisme, 
>    càd la simultanéité   saisie-anticipation

Alors pour résumer, et seulement pour ce problème :

1) la page dans son HEAD fait appel à un JavaScript externe

   <script id="gac_a" tyle="text/javascript"
           src="blabla.php?cherche=0"></script>

   ce JS externe ne contient que la liste des suggestions,
   du genre :

var liste = [
               ['google.fr','Google'],
               ['yahoo.com','Yahoo!']
             ];

   liste est un array d'arrays normal
   (finalement, pas besoin de Json ici)

2) à la frappe dans le champ de recherche
    (sans doute après le 2ième caratère)
    on relance un appel à ce javascript externe
    par une méthode sans doute voisine de :

function newListe() {
var cible = document.getElementById('gac_a');
var s = document.createElement('script');
s.type = 'text/javascript';
s.src = 'http://recherche.php?cherche=' +
          document.forms[0].recherche.value;
cible.parentNode.replaceChild(s, cible);
s.id = 'gac_a';
autocomplete();
}

3) on a en outre un mécanisme de remplissage d'un selecteur
    avec les propositions recueillies :

var liste = [];
function autocomplete() {
var o = document.getElementById('suggestions').options;
o.length = 0;
for(var i=0, n = liste.length; i<n; i++) {
   o[i] = new Option(liste[i][1], liste[i][0]);
   }
}

4) ce qui pourrait nous donner qque chose du genre :

<html>
<script type="text/javascript" src="lister.js"></script>
<script id="gac_a" type="text/javascript"
         src="blabla.php?cherche=0"></script>
<form action="cherche.php">
<p>rechercher :
<input type="text" name="recherche"
        onkeyup="if(this.value.length>1) newListe();">
<select id="suggestions"
 
onchange="location='http://'+this.options[this.selectedIndex].value">
    <option></option>
</select>
<input type="submit">
</form>
</html>

Le fichier 'lister.js' contient les scripts ci-haut :

function newListe() {
var cible = document.getElementById('gac_a');
var s = document.createElement('script');
s.type = 'text/javascript';
s.src = 'http://recherche.php?cherche=' +
          document.forms[0].recherche.value;
cible.parentNode.replaceChild(s, cible);
s.id = 'gac_a';
autocomplete();
}

var liste = [
               ['google.fr','Google'],
               ['yahoo.com','Yahoo!']
             ];
function autocomplete() {
var o = document.getElementById('suggestions').options;
o.length = 0;
for(var i=0, n = liste.length; i<n; i++) {
   o[i] = new Option(liste[i][1], liste[i][0]);
   }
}

Je pense qu'on peut déjà essayer cette mini-démo telle quelle.
Elle ne rechargera rien puisque 'blabla.php' n'existe pas mais affichera 
les choix 'Google' et 'Yahoo'.
Pourtant dans le 'source' de cette page on ne verra pas la liste !


-- 
sm

Groupes favoris (0)

Groupes récents (1)

fr.comp.lang.javascript

Pour commencer

Selection thématique

Hiérarchie des Usenets

Horoscope

Météo