11522 sujets

JavaScript, DOM et API Web HTML5

Zones de la DOM sous MSIE 8.0 non renseignées ?

Bonsoir à toutes et à tous,

j'ai fait le code suivant et je ne comprends pas pourquoi sous "MicroSoft Internet Explorer 8.0", j'obtiens des valeurs nulles ou inconnues alors que sur les autres navigateurs, ces zones sont renseignées ?

De plus, lorsque je consulte la DOM, ces zones sont renseignées !

Quelqu'un pourrait-il me dire pourquoi et comment y remédier !

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
<title>test</title>
<script language="javascript" type="text/javascript">
window.onload = function ()
{
	document.write("window.innerWidth  : " + window.innerWidth + "<br />");
	document.write("window.innerHeight : " + window.innerHeight + "<br /><br />");

	document.write("window.document.body.clientWidth  : " + window.document.body.clientWidth + "<br />");
	document.write("window.document.body.clientHeight : " + window.document.body.clientHeight + "<br /><br />");

	document.write("window.document.documentElement.clientWidth  : " + window.document.documentElement.clientWidth + "<br />");
	document.write("window.document.documentElement.clientHeight : " + window.document.documentElement.clientHeight + "<br />");
}
</script>
</head>
<body>
</body>
</html>

@+
Modifié par Artemus24 (26 Jun 2011 - 21:03)
Bonsoir à toutes et à tous,

en faisant des recherches sur le net, j'ai effectivement trouvé cette page !

Je me suis inspiré des zones correspondantes à la largeur de la fenêtre pour les mettre dans ce petit scripte que j'ai fait ci-dessus.

Et à ma grande surprise, je n'obtiens aucun résultat sur MSIE 8.0 alors que le script de la page dont je me suis inspiré obtient un résultat sur MSIE 8.0.

J'ai pensé à :

1) une erreur dans mon script. D'accord, mais pourquoi sur les autres navigateurs j'obtiens un résultat ?

2) un problème de DOCTYPE ? Non, ce n'est pas cela.

3) déplacer le code JavaScript entre les balise <body> et </body> ? Ce n'est pas cela non plus.

4) il n'y a pas de balise <div> ou autre chose dans la partie body de mon script ? Ce n'est pas ça non plus ?

Et du coup, je ne comprends plus rien à ce script !

Mais le pire est que je retrouve ce genre d'anomalie dans un autre script de test pour le centrage d'un div dans la fenêtre via un code JavaScript. Une fois les valeurs sont correctes. Je relance le même traitement et je n'obtiens plus les mêmes valeurs.

Pourquoi ai-je ce genre d'erreur ?

@+
Par curiosité j'ai fait quelques recherches aussi sur javascriptfr.com et Experts Exchange

Si je me fie à Experts Exchange

window.innerWidth
window.innerHeight

IE does not support this, and I've yet to find some other way to do this.

De même sur javascriptfr.com.
Toutefois Expert Exchange suggère une solution avec innerWith et clientWidth pour IE et FF. Encore là les résultats pour IE ne sont pas précis - semble-t-il.

..
Bonjour à toutes et à tous,

merci Tony Monast et Zardoz de votre intervention.

J'en arrive aux conclusions suivantes :

1) je fais un mauvais usage de ces propriétés avec MSIE 8.0 ! Mais j'ignore totalement comment résoudre mon problème.

2) les renseignements n'existent pas à l'état natif dans MSIE 8.0 et donc il faut faire une bidouille pour les retrouver. Là encore, je dois analyser la DOM pour comprendre comment solutionner mon problème.

3) il existe, peut-être une ou plusieurs fonctions sous MSIE qui pourraient me donner les informations que je recherche.

4) ces propriétés ont un sens différent selon l'objet où il se trouve. Donc même si on croit que la propriété a tel sens ou à telle valeur, il y a sûrement un changement de signification dans tel ou tel navigateur ?

J'ai repris la fonction indiqué par Tony Monast dans mon code HTML. Je constate que si j'appelle la fonction dans la balise <body onload="alertsize();">, j'ai bien mon renseignement pour les autres navigateurs que MSIE mais pour MSIE je n'obtiens pas les bons renseignements.

Sans rien changer, j'ai fait sur la page qui vient de s’exécuter une actualisation et à ma grande surprise, j'ai les bons renseignements cette fois-ci !

Quelqu'un peut-il me donner l'explication du pourquoi et du comment ? Car je ne comprends pas pourquoi j'ai cela ?

Voici le code HTML :
<!DOCTYPE htm l PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
<title>test</title>
<script language="javascript" type="text/javascript">
function alertSize()
{
	var myWidth = 0, myHeight = 0;

	if (typeof(window.innerWidth) == 'number' )
	{
		/*--------*/
		/* Non-IE */
		/*--------*/

		myWidth  = window.innerWidth;
		myHeight = window.innerHeight;
	}
	else
	{
		if (document.documentElement && (document.documentElement.clientWidth || document.documentElement.clientHeight))
		{
			/*-------------------------------------*/
			/* IE 6+ in 'standards compliant mode' */
			/*-------------------------------------*/

			myWidth  = document.documentElement.clientWidth;
			myHeight = document.documentElement.clientHeight;
		}
		else
		{
			/*-------------------------------------*/
			/* IE 6+ in 'standards compliant mode' */
			/*-------------------------------------*/

			if (document.body && ( document.body.clientWidth || document.body.clientHeight))
			{
				/*-----------------*/
				/* IE 4 compatible */
				/*-----------------*/

				myWidth  = document.body.clientWidth;
				myHeight = document.body.clientHeight;
			}
		}
	}

	var chaine = "Width : " + myWidth + " --- Height : " + myHeight;
	window.alert(chaine);
} 
</script>
</head>

<body onload="alertSize();">
<div>voici un exemple de texte dans une boite afin de remplir cette page HTML avec quelque chose !</div>
</body> 
</html>


@+
Modifié par Artemus24 (06 Jul 2011 - 17:02)
Sujet clos
Aller à