11548 sujets

JavaScript, DOM et API Web HTML5

Bonjour,
je code actuellement un petit script js pour recueillir les informations lié à la page (dimension, temps de chargement etc...). La partie posant probleme est chargée de recueillir les dimensions de la fenetre :
if (self.innerWidth) {W = self.innerWidth;H = self.innerHeight;}
else if (document.documentElement && document.documentElement.clientWidth) {W = document.documentElement.clientWidth;H = document.documentElement.clientHeight;}

Toutes ces informations sont insérées dans une division #systeminfos a la fin de la page puis recadrées le long de la page via css :
body.innerHTML += '<div id="systeminfos"><p><strong>Dimensions : </strong>'+W+'x'+H+'</p></div>';

#systeminfos {position:absolute;top:25px;left:50%;margin-left:500px;width:250px;}


Pour information la variable body est obtenue via
var body = document.getElementsByTagName('body')[0];


Or au lancement de ce script (événement : window.onload), la division apparait correctement mais une image sur la page n'est plus affichées (elle est remplacée par la valeur de alt).

J'ai d'abord vérifié l'url de cette image, et en effet, elle n'est plus valide :
http://docs.aboutblank.fr/img/meteo/Ensoleill%E9.gif
est devenue http://docs.aboutblank.fr/img/meteo/Ensoleill%C3%A9.gif

En testant ces deux entités, il semble qu'elles correspondent toutes les deux au caractère é (entités html &eacute;) mais qu'une seule est reconnue par le serveur chargé de gérer les fichiers statiques du site...

Enfin je suis surpris de voir que "innerHTML +=" ne se contente pas d'ajouter les éléments demandés mais réécrit également ce qu'ils précèdent... En effet, en jetant un coup d'oeil a la source dom de la partie contenant cette image
<img src="http://docs.aboutblank.fr/img/meteo/Ensoleill[b]&eacute;[/b].gif" alt="Ensoleill[b]&eacute;[/b]" class="left"/>
est devenu
<img src="http://docs.aboutblank.fr/img/meteo/Ensoleill[b]%C3%A9[/b].gif" alt="Ensoleill[b]é[/b]" class="left"/>


PS : http://aboutblank.fr/ : la page concernée...
RQ : il n'est pas évident que vous puissiez constater ce probleme en allant sur cette page; Cela depend du temps qu'il fera demain dans votre ville car la météo (et l'image en question) est affichée en fonction.
Modifié par ramy (18 Apr 2007 - 22:15)
Salut,
Il me semble que dans tout les cas il vaut mieux éviter les accents dans les url. Enlever l'accent serait donc le meilleur moyen de résoudre ton probléme
Salut,

Il ne faut pas utiliser d'entité caractère ("é") pour échapper les caractères non ASCII dans une URL. Ca revient à écrire directement le caractère en question, car le parseur du navigateur le transforme.

Comme ton navigateur ne connait pas l'encodage du serveur, il échappe "é" en UTF-8 ("%C3%A9") alors que ton serveur utilise ISO-8859-1 ("%E9"). La bonne solution est de fournir l'URL directement encodée, pour éviter que le navigateur ait à faire des suppositions hasardeuses :
<img src="http://docs.aboutblank.fr/img/meteo/Ensoleill%E9.gif" alt="Ensoleillé" class="left" />
Et en passant, ne pas oublier l'espace avant la fermeture de balise ("/>") pour éviter les problèmes de compatibilité HTML.