Page 1 sur 2

FF et les scripts JS

Publié : 27 déc. 2004, 11:46
par veevee
Bonjour,

Je travaille avec Firefox 1.0
Lorsque je charge le fichier suivant et que je lance le script, FF réagit "normalement : il afficghe le docu HTML avec le bouton.
Si je clique le bouton, je lance le script Javascript et FF "tente" de charger quelque chose (le bouton Stop reste rouge)
Je remarque d'ailleurs que les différents navigateurs (FF, Opera, IE) réagissent très différement

Un de vous sait-il pourquoi FF "se bloque" ?

Merci

=============================================
<HTML>
<HEAD>
<META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=iso-8859-1">
<SCRIPT LANGUAGE="JavaScript">
function infinie() {
ix=0;
ix=ix+1;
document.write("toto");
}
</SCRIPT>
</HEAD>
<BODY>
<FORM>
<INPUT TYPE="button" VALUE="boucle" onClick=infinie()>
</FORM>
</BODY>
</HTML>
============================================

Publié : 27 déc. 2004, 12:09
par calimo
Euh... comment ça ?

Publié : 27 déc. 2004, 16:44
par Benoit
Logiquement ça devrait juste écrire "toto", voire rien du tout puisqu'a priori la page est déjà chargée complètement au moment du clic et le document.write aura lieu après la fermeture de la balise "html".

Publié : 28 déc. 2004, 06:57
par Mirovinben
Le Html peut être aisément simplifié et devenir...

Code : Tout sélectionner

<HTML>
<HEAD>
</HEAD>
<BODY>
<FORM>
<INPUT TYPE="button" VALUE="boucle" onClick=document.write("toto")>
</FORM>
</BODY>
</HTML> 
... sans rien changer à la présence du "sablier" dans FF...

En fait, quand on teste avec IE, on constate qu'il y a création et affichage d'une nouvelle page (!?) et quand on regarde le source on n'y voit que "Toto" sans aucune balise acheuteumeuleu !... Un test dans FF entraîne un blocage de l'affichage (=sablier)... On dirait que FF attend qqchose qui ne peut venir... et impossibilité de voir le source de la page après le clic (j'ai Tidy d'installé..)

Publié : 28 déc. 2004, 09:24
par veevee
Bonjour,

Cette affaire est de + en + surprenante.
J'avais supprimé (par erreur)le fichier test.html

Je l'ai réinstallé sur 2 sites :
http://perso.wanadoo.fr/la.mirandole/test.html
et
http:/mistervideo.free.fr/test.html

et ce fichier y restera au moins 10 jours

Résultats des courses :
FF1.0
Sur wana : FF se met toujours "en suspens"
Sur free : FF ne trouve pas le fichier ???

IE 6.0 trouve et effectue le script sans problème sur les deux sites

Opera 7.23
Sur les deux sites même (curieuse) réaction :
La page se charge, quand je lance le script : page blanche (pas de TOTO)
Si je fais page précédente, puis page suivante, TOTO est affiché
J'avais déjà remarqué ce comportement en local

Ca me laisse pensif et vos idées sont les bienvenues

A+

Publié : 28 déc. 2004, 09:52
par ClémentD
J'ai fais des petits test hier et je suis arrivé au même code que Mirovinben.
En Théorie si on fait un document.write après le chargement de la page, comme c'est le cas ici, il est sensé reconstruire entièrement la page, ce qui est le cas, mais je n'ai toujours pas compris le pourquoi de ce chargement infini ...

Publié : 28 déc. 2004, 09:56
par ClémentD
Veeveee, au sujet de tes derniers tests les deux pages fonctionnent, tu as juste oublié un / dans l'adresse chez free et IE, histoire de perturber les gens, le rajoute tout seul ...

http://mistervideo.free.fr/test.html
http://perso.wanadoo.fr/la.mirandole/test.html

Dans les deux cas on observe sous Firefox le chargement infini observé en local.

Publié : 28 déc. 2004, 23:18
par Benoit
Mirovinben a écrit :En fait, quand on teste avec IE, on constate qu'il y a création et affichage d'une nouvelle page (!?) et quand on regarde le source on n'y voit que "Toto" sans aucune balise acheuteumeuleu !... Un test dans FF entraîne un blocage de l'affichage (=sablier)... On dirait que FF attend qqchose qui ne peut venir... et impossibilité de voir le source de la page après le clic (j'ai Tidy d'installé..)
Je pense que Firefox attend simplement la fin de la page (un hypothétique </body> ou </html>). Comme je l'ai signalé plus tôt, ce script écrit après la fermeture du document. Donc les deux navigateurs pensent plus ou moins logiquement qu'il s'agit d'un nouveau document (jusque là ils se comportent pareil). La différence est qu'Internet Explorer suppose qu'il n'y aura rien d'autre dedans, et Firefox suppose que tu vas encore y ajouter quelque chose.

Aucun de ces comportements n'est répréhensible vu la bizarrerie de ce que ce script essaie de faire. Si c'est modifier la page courante après son chargement, il faut utiliser le DOM et pas des document.write (en fait il ne faudrait jamais utiliser des document.write, mais si c'est au chargement de la page c'est encore compréhensible).

Publié : 29 déc. 2004, 04:11
par veevee
Bonjour,
Cette réponse est pour Benoit

1+ je ne suis pas DU TOUT informaticien
J'essaie de comprendre comment fonctionne Javascript
J'essaie de comprendre les réactions des différents navigateurs 'et les différences ne manquent pas)
J'essaie de comprendre les réactions des différents FAI , et, de ce point de vue, write est un générateur de bizarreries exemplaire !!!

Le DOM je ne sais même pas ce que c'est (sans doute que mon étude de JS n'est pas arrivé jusque là, savoir ???)

En tout cas merci pour les réponses

Publié : 29 déc. 2004, 08:02
par Mirovinben
veevee a écrit :Le DOM je ne sais même pas ce que c'est (sans doute que mon étude de JS n'est pas arrivé jusque là, savoir ???)
Grosso modo, ce qu'il faut garder en mémoire :

Quand, suite à une requête au serveur hébergeant la page que tu veux consulter, ton navigateur traite le code Html pour afficher, il...

-1- lit depuis le début jusqu'à la fin (logique),
-2- saute les éléments postionnés en "absolute" pour un éventuel affichage ultérieur,
-3- affiche au fur et à mesure les éléments visuels, tente de trouver les éléments graphiques à insérer et exécute les scripts quand il les rencontre
-4- batit simultanément le DOM (*)
-5- et s'arrête quand il rencontre </body>

Un bémol : les tableaux sont lus complètements (de <table> à </table>) avant d'être affichés, ceci pour déterminer tailles et fusionnage des cellules... D'où certains ralentissements lors de l'affichage.

(*) toujours grosso modo, le DOM est l'arborescence des objets rencontrés pendant la lecture de la page... Et ton navigateur conserve cette structure en mémoire tant que tu ne quittes pas la page. Qui dit "arborescence" dit "hiérarchie", chaque élément (<body>, <div>, <table>, <a>...etc...) est contenu dans un autre (il en est le fils) et/ou peut en contenir un autre (il en est le père). Avec des scripts, tu peux consulter la position d'un élément, modifier ses attributs (couleur, taille, etc...) et même en rajouter... Tout celà, évidemment, en respectant certains règles !...

En conclusion, il te faut impérativement connaître les principaux éléments, paramétrages et modes d'interprétation du langage Html puis apprendre la syntaxe de ton langage de scripts favoris (en général Javascript) et faire un mix élégant des deux !...

voili voilà...

Publié : 29 déc. 2004, 10:34
par Benoit
En fait, document.write sert (comme son nom l'indique), à écrire directement dans le document au moment où il est en train d'être construit à partir des balises, à l'endroit où il se trouve dans le code source.

Le problème est que tu appelles document.write dans une fonction déclenchée à partir d'un évènement 'onclick'. Au moment où se fait ce clic, le document est normalement déjà complètement chargé depuis longtemps (sinon on ne verrait pas le bouton). Ce que les navigateurs comprennent donc, ce n'est pas "écris dans le document à l'endroit où tu es" (puisqu'ils ont terminé de le charger) mais "écris à la place du document".

Ce que tu pourrais faire en utilisant DOM (référence ici : http://www.mozilla.org/docs/dom/domref/ ):

Code : Tout sélectionner

<script type="text/javascript">
function infinie() {
  // création d'un bout de texte
  var toto = document.createTextNode("toto");
  // création d'un paragraphe
  var para = document.createElement("p");
  // ajout du texte dans le paragraphe
  para.appendChild(toto);
  // ajout du paragraphe dans le corps de texte
  document.body.appendChild(para);
} 
</script>
Avec ça, à chaque clic sur le bouton, un nouveau paragraphe contenant "toto" sera ajouté à la fin du body. C'est pour aller bien avec le titre de la fonction :)

Évidemment dans la réalité tu remplaceras plutôt un paragraphe existant (éventuellement vide au départ) que d'en ajouter un à chaque fois.

Publié : 29 déc. 2004, 12:46
par veevee
Bonjour,
Voilà ce que j'appelle une contribution estimable :
- rester à la portée du neuneu qui se donne un peu de peine
- encourager le neuneu à chercher par lui-même
- lui donner assez d'indications pour qu'il puisse démarrer

Merci Monsieur Mirovinben

Publié : 06 janv. 2005, 09:01
par veevee
Bonjour,

l'affaire document.write reprebd de l'ampleur

En "travaillant" BREAK je me suis aperçu que document.write semait la panique dans un script

Voyez la chose sur http://mistervideo.free.fr/break1.html (script SANS document.write)
et http://mistervideo.free.fr/break2.html où un document.write tout bête est en état de nocivité

En local, ça déclare une faute
Sur site, le BREAK à l'air de ne pas être éxécuté

Le neuneu se pose des questions (dangereux un neuneu qui a des etats d'ame) :D

Mercci

Publié : 06 janv. 2005, 09:21
par Mirovinben
Ben, comme l'a dit Bruno plus haut, c'est parceque les "write" sont exécutés via une action sur un bouton après et en dehors du flux, bien après la fin d'analyse/affichage de ta page.

Les "write" sont alors dans l'incapacité d'écrire entre <body> et </body> puisque la page a fini d'être chargée. D'où les effets étranges zet curieux que l'on peut constater et qui dépendent de la permissivité du navigateur se trouvant confronté à cette situation.

Par contre Javascript gère très bien "alert" qui affiche en dehors du flux à l'aide d'une fenêtre demandée à ton système d'exploitation via ton navigateur...

J'ajoute que l'instruction "break" se borne à sortir du bloc d'instruction où elle se trouve avant la fin normale (cas fréquents : while ou switch)

Publié : 06 janv. 2005, 09:53
par Benoit
Ce qui se passe c'est qu'au moment du document.write(), tu écrases la page courante, y compris ses variables. C'est pour ça qu'on voit dans la console

Code : Tout sélectionner

Erreur : flag1 is not defined
Fichier Source : http://mistervideo.free.fr/break2.html
Ligne : 9


Pour être plus clair, document.write() ne doit pas être utilisé dans un évènement comme onclick(). Le seul cas où ça a un sens c'est pour générer un texte personnalisé au chargement de la page (par exemple la date et l'heure) ; et même là c'est déconseillé, il vaut mieux utiliser le DOM (comme le bout de code que je t'ai donné l'autre jour) et un évènement onload.

P.S. Normalement pour sortir d'une boucle on change la variable sur laquelle est testée la condition plutôt que d'utiliser break. Break veut dire qu'on sort précipittament d'une boucle qu'on ne peut pas terminer pour une raison inattendue. À moins d'être dans un switch() où break sert à délimiter un cas particulier.