11525 sujets

JavaScript, DOM et API Web HTML5

[Résolu] Problème compatibilité avec IE

Pages :
Je suis entrain de faire un site web... j'utilise Firefox pour visualiser le rendu... mais je viens de tester avec IE et j'ai des gros soucis de compatibilité!! Smiley fache Smiley fache Et avec quasiment toutes mes fonctions javascript !!! Smiley bawling

J'ai essayé de simplifié au maximum pour voir d'où venait l'erreur mais sans succès ...

Voilà un exemple très simple

<body>
<div id="test" />
	<SCRIPT LANGUAGE="JavaScript">
		div=document.getElementById("test");
		test=document.createTextNode("test");
		div.appendChild(test);
	</SCRIPT>
</body>


avec firefox ça affiche "test" et avec IE rien du tout !?

quelqu'un peut m'expliquer pourquoi et comment pallier à ce problème please ??

merkiiii

PS: pour info la version de IE que j'utilise est :
a écrit :
Version 6.0.2800.1106.xpsp2.050301-152CO

Modifié par Poich (22 Jul 2005 - 10:36)
Ta page est mal construite :

- on n'utilise pas "language=brol" mais "type="text/javascript""

- on ne met pas de balise script dans le body (et encore moins dans un div) mais dans le head du document

- tant qu'a faire, on met les balise en minuscule

:)
c'est mieux comme ça ?

<html>
<head>
<title>test</title>
<script type="text/javascript">
		div=document.getElementById("test");
		test=document.createTextNode("test");
		div.appendChild(test);
</script>
</head>
<body>
<div id="test" />
	
</body>
</html>


parce que ça ne marche pas non plus Smiley decu


a écrit :
- on ne met pas de balise script dans le body (et encore moins dans un div) mais dans le head du document


à quelle moment le script est executé alors ? parce que je me dis que si je fais un getElementById("test") et que cet element n'existe pas encore ça va pas marcher non ?
La balise <div> s'ecrit <div></div> et non pas <div />

Ensuite comme tu executes une fonction qui va triturer le code html de ta page il faut s'assurer que la fonction soit executée apres le chargement de la page Smiley smile et on fait ca comme ca :

<html>
<head>
<title>test</title>
<script type="text/javascript">
window.onload = function() {
		div=document.getElementById("test");
		test=document.createTextNode("test");
		div.appendChild(test);
}
</script>
</head>
<body>
<div id="test"></div>
</body>
</html>
TriadPtale a écrit :
on ne met pas de balise script dans le body (et encore moins dans un div) mais dans le head du document


Lapsus ? Smiley cligne

<script> est un élément tout à fait valide dans <body> comme dans <head> (heureusement)

Il peut être placé dans n'importe quel élément de niveau bloc (donc dans une <div>
Modifié par Laurent Denis (18 Jul 2005 - 17:42)
Oui, mais je voulais dire "il vaut mieux" , enfin une règle de bonne pratique quoi Smiley langue

Mais bon ce n'étais pas très clair la façon dont je l'ai dit Smiley cligne
afbilou a écrit :
La balise <div> s'ecrit <div></div> et non pas <div />

Ensuite comme tu executes une fonction qui va triturer le code html de ta page il faut s'assurer que la fonction soit executée apres le chargement de la page Smiley smile et on fait ca comme ca :

<html>
<head>
<title>test</title>
<script type="text/javascript">
window.onload = function() {
		div=document.getElementById("test");
		test=document.createTextNode("test");
		div.appendChild(test);
}
</script>
</head>
<body>
<div id="test"></div>
</body>
</html>



Merci de l'info mais ça ne marche pas plus ?!! Smiley sweatdrop
Essaie de renommer tes variables javascript parce que là il y a des test de partout et il arrive qu'IE n'apprécie pas.
Il faut rajouter var devant les declaration de variables :
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr">

<head>
	<title>Test</title>
	<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />

	<script type="text/javascript">
		window.onload = function() {
			var div=document.getElementById("test");
			var test=document.createTextNode("test");
			div.appendChild(test);
		}
	</script>

</head>

<body>

<div id="test"></div>

</body>

</html>
TriadPtale a écrit :
Oui, mais je voulais dire "il vaut mieux" , enfin une règle de bonne pratique quoi Smiley langue


Moi, je veux bien. je ne demande pas mieux. Je suis toutes ouïes Smiley cligne Mais alors, un préalable : l'utilité ?
La même utilité que celle qui dit qu'il vaut mieux mettre son code dans une feuille externe Smiley langue
Donc, si je t'ai bien suivi, mettre les éléments <style> dans le <head> plutôt que dans le <body> séparerait structure et comportement, avec les avantages induits ?

<edit>Bon, cela dit, s'il y a des bp à travailler sur ce sujet, elles évidemment les bienvenues où vous savez Smiley cligne </edit>
Modifié par Laurent Denis (18 Jul 2005 - 20:03)
Si tu regroupe tout tes script dans une balise script , ça ne change rien que ce soit dans le head ou dans le body.

Mais bon si on commences à mettre des scripts partout, oui c'est ce que je veux dire.
je ne demande qu'à comprendre et à apprendre de nouvelles choses : en quoi est-ce gênant de mettre des scripts partout, c'est à dire dans le <head> et à divers endroits du <body> ? Pour qui ?

(Là, on va commencer à trouver des choses tangibles, sérieux Smiley cligne )
Modifié par Laurent Denis (18 Jul 2005 - 20:06)
La conception est facilité lorsqu'on separe au maximum les divers aspects d'un site.

Le fichier html : structure et contenu.
CSS : la mise en forme.
javascript : evenementiel et extension de structure.

Si un jour tu veux modifier un script de ta page il est bien plus agreable et facile d'ouvrir le fichier .js qui contient le script en question plutot que de parcourir tout le document html a la recherche de ton script.

De meme si tu dois supprimer un script il suffit de mettre l'appel au fichier source qui se trouve dans le <head> en commentaire et le tour est joué.

Enfin la séparation des contenus oblige a une certaine proprete du code car certains bricolages auxquels le debutant cederait ne marcheraient pas en mettant le script dans un fichier separé Smiley cligne
On ne parlait pas de l'externalisation des scripts dans des fichiers .js ou autres (cas connu et très bien argumenté ailleurs), mais de l'utilité de mettre des scripts "en dur" à un endroit donné du doument HTML, et non "un peu partout", quand il est acquis qu'ils ne sont pas placés à l'extérieur dans des fichiers .js pour une raison ou une autre.
Bonsoir,

Il n'y à aucune contre-indication, pas plus que de problème à inclure des passages javascript dans le corps d'un document.

Ils ont strictement le même comportement et le même statut.

C'est même particulièrement utile, voir indispensable, pour relayer des fonctions un peut lourde (comme le repliement onload de liste de menu de type tree-wiew) qui peuvent provoquer un effet désagréable à l'ouverture de la page.

Mais c'est comme tout, il faut que ce soit bien fait, pertinent et utile... Smiley smile

Peut-être que TriadPtale faisait en revanche référence à des passages javascripts mal implémentés, sans section CDATA ou balise de commentaire pour les pages du siècle dernier... Smiley cligne

JP
Merci à vous tous pour ces infos sur javascript.


cependant je reviens sur mon problème de base car ça ne marche pas exactement comme je veux Smiley decu

voilà mon code :
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title>test</title>
<script language="JavaScript1.2" type="text/javascript">
<!--
function createLigneDePalmares(){
	var tableau=document.getElementById("palmares");
	var ligne=document.createElement("tr");
	var col=document.createElement("td");
	col.setAttribute("colspan", "4");
	var test=document.createTextNode("nouvelle ligne");
	tableau.appendChild(ligne);
	ligne.appendChild(col);
	col.appendChild(test);
}
-->
</script>
</head>
<boby>
<table width="100%" class='tbcadre' id="palmares" border="1">
	<tr>
		<td class='darkrow2' colspan='4'><div align="center"><b>Palmarès</b> [ <a id="ajoutLigne" style="cursor:pointer;" href="javascript:createLigneDePalmares();">ajouter une ligne de palmarès</a> ]</div></td>
	</tr>
	<tr>
		<td class="darkrow3" width="105"><div align="center"><b>Date</b><br />(jj-mm-aaaa)</div></td>
		<td class="darkrow3"><div align="center"><b>Lieu</b></div></td>
		<td class="darkrow3"><div align="center"><b>Titre</b></div></td>
		<td class="darkrow3" width="20"><div align="center"><b>Supprimer</b></div></td>
	</tr>
	<tr id="empty">
		<td class="tbline" colspan="4"><div align="center">Vide ...</div></td>
	</tr>
</table>
</boby>

</html>


ça marche (ça créer une ligne) sous Firefox mais pas sous IE !!


j'ai pourtant rajouter var devant les declaration de variables, comme afbilou l'a dit ! Smiley eek

vous avez une idée pour expliquer ça ?
Modifié par Poich (19 Jul 2005 - 09:42)
Pages :
Sujet clos
Aller à