Régler le problème javascript de l'apostrophe...

Soyez le premier à donner votre avis sur cette source.

Snippet vu 21 137 fois - Téléchargée 29 fois

Contenu du snippet

Exemple de scripts élémentaires avec un texte comportant divers caractères réservés précédés du backslash et explication...

Source / Exemple :


<!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>
    <title></title>
    <script type="text/javascript">
        //<![CDATA[ 
        function a() { 
            document.getElementById('A').innerHTML = "<button type=\"button\" id=\"button1\" onclick=\"alert('Coucou');\">Bouton d\'alerte</button>";
        }
        function b() {
            document.getElementById("B").innerHTML = '<button type=\'button\' id=\'button2\' onclick=\'alert("Coucou");\'>Bouton d\'alerte</button>';
        } //' " \ b f n r t v; \' \" \\ \b \f \n \r \t \v
        //]]>
    </script>
</head>

<body onload="a(); b();">
<h1>Régler le problème de l'apostrophe...</h1>
<hr />
<p>
Certains caractères présentent la particularité d'être interprétés différemments suivant leur utilisation dans un 
script. Les guillemets ou l'apostrophe par exemple peuvent introduire une valeur d'attribut html ou une valeur de variable, etc.
Par ex: document.write('<p>Coucou</p>'); ou bien encore var a; a = "coucou"; etc. Selon les situations des 
ambiguités peuvent empécher l'interprétation ce qui arrête l'exécution du script et renvoie une erreur à l'écran.<br />
</p>
<p>
1/ Le backslash peut être utilisé afin d'oter les ambiguités d'interprétation.
</p>
<p>
2/ Dans un script les caractères seuls  ' " \ b f n r t v sont interprétés différemment s'ils sont précédés ou non 
d'un backslash (les cas de ' " sont traités 3; x et u qui ont aussi une certaine importance ne sont pas traités).<br />
\ b f n r t v peuvent être de simples caractères formant une expression littérale quelconque... 
</p>
<button type="button" id="button1" onclick="alert('Coucou\CoucoubCoucoufCoucounCoucourCoucoutCoucouvCoucou');">Bouton d'alerte</button>
<p>Munient d'un backslash \\ \b \f \n \r \t \v peuvent impliquer une altération du rendu écran de l'expression...</p>
<button type="button" id="button2" onclick="alert('Coucou\\Coucou\bCoucou\fCoucou\nCoucou\rCoucou\tCoucou\vCoucou');">Bouton d'alerte</button>
<p>
3/ L'utilisation de ' " se fait souvent dans des situations "plus complexes" que précédemment par ex:<br />
document.getElementById('A').innerHTML = "<button type=\"button\" id=\"button1\" onclick=\"alert('Coucou');\">Bouton d\'alerte</button>";
</p>
<div id="A"></div>
<p>
Dans ce cas, l'ambiguité, qui réside dans le nombre des interprétations possibles de ' et " inhérentes à leur usage 
et qui retourne une erreur quand elle n'est pas levée, est otée par l'utilisation du backslash qui introduit la 
lecture de la séquence qui suit (le caractère ambigue) d'après son code, alors unique, du type %n° 
(%22 pour guillemet %27 pour apostrophe par exemple).<br />
Dans le cas ci-dessus donc:<br />
Les premiers apostrophes permettent dans une instruction de définir un indentifiant.<br />
Les guillemets qui suivent = et termine le code html à enchasser dans le bloc div définissent une chaine principale
en tant qu'objet.<br />
Les guillemets dans la chaine permettent de définir les valeurs des attributs html ils sont indispensables en 
xhtml, mais ne définissent pas un objet.<br />
Les apostrophes dans la commande d'alerte définissent une expression littérale dans la chaine principale, tandis que le 
texte du bouton n'est qu'une partie de la chaine principale.<br />
Dans le respect du même schéma il est donc possible d'écrire:<br />
document.getElementById("B").innerHTML = '<button type=\'button\' id=\'button2\' onclick=\'alert("Coucou");\'>Bouton d\'alerte</button>';
</p>
<div id="B"></div>
<p>
(Pour mémoire, dans un document HTML l'écriture conventionnelle reste <button type="button" id="button1" onclick="alert('Coucou');">Bouton d'alerte</button>)
</p>
<p>
l'interprétation par la machine est de la forme:<br />
document.getElementById("B").innerHTML = '<button type=%27button%27 id=%27button1%27 onclick=%27alert("Coucou");%27>Bouton d%27alerte</button>';
</p>
<p>
4/ Les caractères listés ci-dessus peuvent encore être utilisés dans les commentaires de scripts.
Afin que leur prise en compte reste celle qui doit être faite pour du texte l'on placera avant deux slachs:
//' " \ b f n r t v; \' \" \\ \b \f \n \r \t \v  (voir source).
</p>
<hr />
Salut, LGH.
<p><a href="http://validator.w3.org/check?uri=referer"><img src="http://www.w3.org/Icons/valid-xhtml10" alt="Valid XHTML 1.0 Transitional" border="0" height="31" width="88" /></a></p>
</body>

</html>

Conclusion :


Il suffit de copier la page ci-dessus de la coller dans notepad de l'enregistrer au format htm...

A voir également

Ajouter un commentaire Commentaires
Messages postés
2493
Date d'inscription
jeudi 14 juillet 2005
Statut
Contributeur
Dernière intervention
5 juin 2016
1
Et en plus le code n'est même pas indenté !
De toutes façons c'est la base de tous les langages C-style ( C(++), PHP, JS, Java, ... )
Messages postés
12303
Date d'inscription
mardi 10 février 2004
Statut
Membre
Dernière intervention
30 juillet 2012
42
j'arrives après une mise a jour, et je me demandes ce que c'était avant...
sinon une autre de ses source est vraiment pourri (j'en viens) pas un pet de javascript... c'ets pas un concour de html ici, c'ets même pas un coucour, mais tu peux poster tes scripts quand ils sont a peu près corects mais pas ça...

si tu veux aiuder les débutants, expliques ce que c'ets que le web, coment foncitone ce réseau géant, et comment mettre son site en ligne... la, tu ne peux pas dire que tu fais qqch pour les débutants...
Messages postés
323
Date d'inscription
lundi 24 février 2003
Statut
Membre
Dernière intervention
17 mai 2005

J'avais pas remarqué que c'était lui le posteur des nombres pair/impair....heureusement pour lui ^^
Quant aux C/C++ je ne fréquente pas encore ce site :)
Messages postés
385
Date d'inscription
mardi 15 octobre 2002
Statut
Membre
Dernière intervention
19 décembre 2017

surtout que le benben77 ça date quand même de plus d'une semaine...
et encore y vient d'être posté de belles merdes sur phpcs (nombre pair & verlan) tout comme sur cppfrance...
y'a de l'abus, une "source" n'est pas une "fonction", sinon je balance l'intégrale des fonctrions php et ça me fait 500 sources !

c'était mon coup de gueule de la journée...
Messages postés
323
Date d'inscription
lundi 24 février 2003
Statut
Membre
Dernière intervention
17 mai 2005

Ok ils n'ont pas que ça à faire mais quand même...
Afficher les 10 commentaires

Vous n'êtes pas encore membre ?

inscrivez-vous, c'est gratuit et ça prend moins d'une minute !

Les membres obtiennent plus de réponses que les utilisateurs anonymes.

Le fait d'être membre vous permet d'avoir un suivi détaillé de vos demandes et codes sources.

Le fait d'être membre vous permet d'avoir des options supplémentaires.