Tester du code html généré par javascript

**awalter1** · 06/03/2012, 10h09

Bonjour,
Dans un exemple pris sur le net tel que :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE>Galerie photos, Java Script, Tedheu révision mai_2008</TITLE>
<STYLE type="text/css">
BODY,TD,A,P {font-family:verdana,sans-serif; font-size:11px;}
</STYLE>
<SCRIPT language="JavaScript">
...
// la fonction bdvgt renvoie un tableau HTML
bdvgt(2,largbande,replist,imalist,orilist,altlist,leglist);
</SCRIPT>
</DIV>
<!-- ---- -->
 
<!-- votre code HTML -->
 
</BODY>
</HTML>

Comment peut t'on connaitre le "tableau html" renvoyé par la fonction bdvgt. Ya t'il des moyens de déboguage lorsque l'html est généré par du php ou du javascript ou autre ?
Merci

**Hijack** · 06/03/2012, 10h38

Ce code est vraiment pas terrible ! Pas de balise </HEAD>, une div fermée mais pas ouverte...

Comment peut t'on connaitre le "tableau html" renvoyé par la fonction bdvgt. Ya t'il des moyens de déboguage lorsque l'html est généré par du php ou du javascript ou autre ?

Pour du Javascript ou du PHP, tu peux voir la valeur de retour en faisant du pas à pas dans un IDE. (Je pense à XDebug pour php par exemple sous Eclipse, ou au développeur tools de chrome pour le javascript).

Et au pire tu as toujours la possibilité d'afficher sur ton navigateur le HTML renvoyé et de voir ce qui pose problème...

**awalter1** · 06/03/2012, 11h15

Envoyé par Hijack

Et au pire tu as toujours la possibilité d'afficher sur ton navigateur le HTML renvoyé et de voir ce qui pose problème...

C'est ça qui m'intéresse : mais comment faire ? Si je fais "souris bouton droit / afficher code source de la page" je ne vois rien de plus que le code initial de ma page.
Merci

PS: pour le code pas terrible, j'ai fait un "copier/coller" peu pertinent pour ne publier que ce qui me semble utille pour la compréhension de mon propos.

**Hijack** · 06/03/2012, 11h26

Il est normal que tu ne vois que le code initial de la page, puisque tu n'affecte pas le résultat de ta fonction Javascript.

Le plus simple serait de faire une div au dessus et d'y affecter ton résultat :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
 
...
<div id="test_bdvgt"></div>
<SCRIPT language="JavaScript">
...
// la fonction bdvgt renvoie un tableau HTML qui est stocké dans la variable bdvgt_result
var bdvgt_result = bdvgt(2,largbande,replist,imalist,orilist,altlist,leglist);
//Affectation du resultat dans la div d'affichage (syntaxe utilisant jQuery)
$('#test_bdvgt').html(bdvgt_result);
//Ou affichage du code html pur dans une popup
alert(bdvgt_result);
</SCRIPT>
...

**thelvin** · 06/03/2012, 11h27

Envoyé par awalter1

C'est ça qui m'intéresse : mais comment faire ? Si je fais "souris bouton droit / afficher code source de la page" je ne vois rien de plus que le code initial de ma page.

Oui certains navigateurs font ça. Dans ce cas, la seule solution c'est leurs outils de debug avec inspection de DOM, par exemple.

**NoSmoking** · 06/03/2012, 13h23

Bonjour,
il y a lourd à parier que ta fonction fasse des document.write, dans ce cas l'affectation du résultat de la fonction dans une variable risque de te ramener un joli undefined.

Tu peux mettre le code dans une DIV et faire un alert de DIV.innerHTML

Tu peux sélectionner le texte est faire un affichage code sélection, mais ne marche pas avec tous les navigateurs

Tu peux faire une inspection de l'élément, via un click droit, et/ou encore la plus aboutie, l'inspection DOM, comme te l'a indiqué thelvin.

**awalter1** · 06/03/2012, 20h42

Merci pour votre aide

Tester du code html généré par javascript

HTML

Vue hybride

Discussions similaires

Partager

Partager