Affichage code HTML sans interprétation

**FRANCKYIV** · 22/08/2006, 12h27

Bonjour les gens

Voila, je cherche à inscrire un code HTML dans une page HTML sans qu'il ne soit interprété.

Du style je crée un tableau en HTML, et je ne veux pas que la page affiche le tableau HTML mais qu'il affiche le code source.

Je connais la méthode de remplacer par exemple les < ou > par les caractères spéciaux, mais le problème est que cela serait trop long vue tout ce qu'il y a a afficher ...

Quelqu'un aurait une solution ?

**speedev** · 22/08/2006, 12h41

Ben....tu mets en commentaire la parcelle de code que tu ne veux pas afficher lol

Code :

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

1
2
3
4
5
<!-- 
<div style="margin-left:40px"><table>
<div style="margin-left:40px"><tr>
<div style="margin-left:40px"><td>
 <div style="margin-left:40px">coucou je suis caché</div></td></div></tr></div></table></div> -->

^^' non?

**FRANCKYIV** · 22/08/2006, 12h47

Ben nan ... si j'mets un commentaire, je ne vois pas le code HTML dans la page HTML ... mais dans la source ...

Moi je veux voir le code directement à partir de la page (sans que le navigateur l'interprète).

**speedev** · 22/08/2006, 12h49

Haaa ok

met la parcelle de code en question entre les balises <pre> et </pre>

**FRANCKYIV** · 22/08/2006, 12h54

J'ai déjà essayé mais ça ne fonctionne pas, il m'affiche bien le tableau et non les balises ...

**speedev** · 22/08/2006, 12h58

heu ya <code> </code>sinon....

Et sinon ben à part remplacer tous les caractères par le jeux de caractères HTML ou autrement faire un affichage par PHP je vois pas d'autres solutions.

**CR_Gio** · 22/08/2006, 13h06

hi all,

peut etre que ce-ci pourai t'aider ... (le code est toujours interpreté ... d'une façon ou d'une autre ^_^)

Code style html :

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

&lt;table border=&quot;0&quot;?&gt;

Tu pourra trouver un tableau avec tout les carractere ici :

Code :

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

http://www.henri-ruch.ch/HTML/caracteres/caractere.asp

Envoyé par mot clef

HTML table caractere

heu ya <code> </code>sinon....

(c'est pour la font du text)

dans l'espoire de t'aider ...

++

**speedev** · 22/08/2006, 13h09

Oui mais le soucis c'est qu'il a beaucoup de code a permuter....

**CR_Gio** · 22/08/2006, 13h13

Envoyé par speedev

Oui mais le soucis c'est qu'il a beaucoup de code a permuter....

c'est pourquoi il y a des editeur HTML ... entre autre xD

**speedev** · 22/08/2006, 13h14

Semblerait pas qu'il puisse le faire avec son éditeur

**Candygirl** · 22/08/2006, 13h53

Peut-être par le biais d'une petite fonction javascript qui encode ce qui se trouve à l'intérieur de la balise code, par exemple ?
Du genre (je ne maîtrise pas vraiment javascript c'est juste un exemple, la fonction serait à revoir plus en détail):

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
20
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>test</title>
 
<script type="text/javascript">
function changecode(){
        var codes = document.getElementsByTagName("code");
        for (var i=0; i<codes.length; i++)
                codes[i].innerHTML = codes[0].innerHTML.replace(/</gi,"&lt;");
        }
// -->
</script>
</head>
 
<body onload="changecode();">
<code><table><tr><td>test</td></tr></table></code>
</body>
</html>

**speedev** · 22/08/2006, 13h57

cela marcherait sans problème moyennant qu'on prenne en compte toutes les modifications nécessaires seulement je ne serai pas étonné qu'il existe un moyen plus simple et fait pour.

**Candygirl** · 22/08/2006, 14h08

Il me semble avoir lu une fois qu'il y avait une balise qui permettait de le faire mais qu'elle n'existe plus ou alors qu'elle était propriétaire d'un seul navigateur ?; mais je peux me tromper...

Clair, j'espère aussi qu'il y a plus simple

**FRANCKYIV** · 22/08/2006, 14h26

Alors pour résumer, les balises :
<pre>, <code> ne fonctionnent pas.

L'idée des caractères (qui fonctionne) n'est pas intéressante car il faudrait se taper des lignes entières ... (oui je sais, on peut faire "remplacer partout" mais bon).

L'idée d'un code Javascript n'est pas mauvaise, mais il faudrait carrément développer un "petit" script ...

Pour l'histoire du php, comment faire ?

**Candygirl** · 22/08/2006, 14h55

Envoyé par FRANCKYIV

Pour l'histoire du php, comment faire ?

Avec htmlentities, il me semble:
http://fr.php.net/htmlentities

(enfin mes notions de php sont encore pires que pour le javascript

)

**FRANCKYIV** · 22/08/2006, 15h00

Ca à l'air intéressant, marchi

Je regarderai plus tard, je suis occupé actuellement.

**speedev** · 22/08/2006, 15h18

Olà olà mais t'embête pas trop non plus.
Au pire comme dit un collègue tu mets ton code dans un textarea que tu adaptes à ta page avec du css ^^

**CR_Gio** · 22/08/2006, 23h02

bien vue pour la balise textarea ;-)

mais je pense que si on affiche du code, ca serrai bien de pouvoir le mettre en valeur :-D ...

J'ai entendu parlé de php, on pourai faire une petite fonction qui retranscrit le code HTML en code html xD

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
<?php

/* no comment */
$string = '<table border="0"></table>';


/* no comment */
$string=str_replace("<", "&lt;", $string);
$string=str_replace(">", "&gt;", $string);

$string=str_replace("\"", "&quot;", $string);//output : <table border="0"></table>

//$string=str_replace("\"", "<span style=\"color:red;\">&quot;</span>", $string);//output : <table border="0"></table>

/* no comment */
echo $string;
?>

Pour ce qui est de mettre du javascript pour faire la retranscription des balise HTML je ne trouve pas ca approprié (c'est un avis personnel)

voila! c'est tout ce que j'avai a dire :-D

++

**speedev** · 23/08/2006, 13h31

FRANCKYIV je viens de repérer un truc sur un site et ça m'a rappelé ton post.

essaye de mettre les parcelles de code que tu veux afficher sans interprétation de cette manière:

Code :

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

1
2
3
4
5
6
 
<pre>
<div style="margin-left:40px"><code>
<div style="margin-left:40px">
<table class="machin">
<div style="margin-left:40px"><tr><td>Je suis du code </td></tr></div></table></div></code></div></pre>