Insertion code javascript dans XHTML

[Athmos]

Hello,

j'ai un problème d'insertion de code javascript en XHTML lors de la validation :

<script type="text/javascript">
var data, p;
var agt=navigator.userAgent.toLowerCase();
p='http';
if((location.href.substr(0,6)=='https:')||(location.href.substr(0,6)=='HTTPS:')) {p='https';} data = '&r=' + escape(document.referrer) + '&n=' + escape(navigator.userAgent) + '&p=' + escape(navigator.userAgent)
if(navigator.userAgent.substring(0,1)>'3') {data = data + '&sd=' + screen.colorDepth + '&sw=' + escape(screen.width+ 'x'+screen.height)};
document.write('<a href="http://www.RoboStats.com" target="_blank" >');
document.write('<img border=0 hspace=0 '+'vspace=0 src="http://www.RoboStats.com/counter.php?i=78' + data + '"> </a>');
</script>

La validation refuse les + + de la dernière ligne !

Comment faire ?

Merci.

[Antoine Cailliau]

Si mes souvenirs sont bons, ils faut encadrer le script de balise de commentaire.

<script type="text/javascript">
<!--
var data, p;
var agt=navigator.userAgent.toLowerCase();
p='http';
if((location.href.substr(0,6)=='https:')||(location.href.substr(0,6)=='HTTPS:')) {p='https';} data = '&r=' + escape(document.referrer) + '&n=' + escape(navigator.userAgent) + '&p=' + escape(navigator.userAgent)
if(navigator.userAgent.substring(0,1)>'3') {data = data + '&sd=' + screen.colorDepth + '&sw=' + escape(screen.width+ 'x'+screen.height)};
document.write('<a href="http://www.RoboStats.com" target="_blank" >');
document.write('<img border=0 hspace=0 '+'vspace=0 src="http://www.RoboStats.com/counter.php?i=78' + data + '"> </a>');
-->
</script>

Modifié 7 Février 2005 par Antoine Cailliau

[K-ZimiR]

Correction pour les commentaires : le commentaire fermant doit comporter un commentaire JavaScript devant, comme ceci :

<script type="text/javascript">
<!--
var data, p;
var agt=navigator.userAgent.toLowerCase();
p='http';
if((location.href.substr(0,6)=='https:')||(location.href.substr(0,6)=='HTTPS:')) {p='https';} data = '&r=' + escape(document.referrer) + '&n=' + escape(navigator.userAgent) + '&p=' + escape(navigator.userAgent)
if(navigator.userAgent.substring(0,1)>'3') {data = data + '&sd=' + screen.colorDepth + '&sw=' + escape(screen.width+ 'x'+screen.height)};
document.write('<a href="http://www.RoboStats.com" target="_blank" >');
document.write('<img border=0 hspace=0 '+'vspace=0 src="http://www.RoboStats.com/counter.php?i=78' + data + '"> </a>');
//-->
</script>

[Sylvain Trovalet]

<script type="text/javascript">
// <![CDATA[ 
var data, p;
var agt=navigator.userAgent.toLowerCase();
p='http';
if((location.href.substr(0,6)=='https:')||(location.href.substr(0,6)=='HTTPS:')) {p='https';} data = '&r=' + escape(document.referrer) + '&n=' + escape(navigator.userAgent) + '&p=' + escape(navigator.userAgent)
if(navigator.userAgent.substring(0,1)>'3') {data = data + '&sd=' + screen.colorDepth + '&sw=' + escape(screen.width+ 'x'+screen.height)};
document.write('<a href="http://www.RoboStats.com" target="_blank" >');
document.write('<img border=0 hspace=0 '+'vspace=0 src="http://www.RoboStats.com/counter.php?i=78' + data + '"> </a>');
//]]>
</script>

[Dan]

Bonjour Sylvain,

Je vois dans ton code que tu utilises :

<![CDATA[
...
//]]>

Quelle est l'utilité de cette balise ?

[Athmos]

Merci pour vos réponses, il reste un warning lors de la validation (dans les 2 cas).

Mais je pense que ça passe ?!

Je crois que le CDATA permet de déclarer les symbols " / & ..." comme étant partie intégrante du code JAVA et non pas XHTML sinon il interpréterait les "/" par exemple.

Modifié 7 Février 2005 par Athmos

[Antoine Cailliau]

Les CDATA c'est pour le XML

La version correcte étant

<!--
...
//-->

pour le javascript

[petit-ourson]

Visiblement pour le xhtml aussi ce qui est compréhensible vu que normalement il est servi comme du html+xml

4.8. Script and Style elements

In XHTML, the script and style elements are declared as having #PCDATA content. As a result, < and & will be treated as the start of markup, and entities such as < and & will be recognized as entity references by the XML processor to < and & respectively. Wrapping the content of the script or style element within a CDATA marked section avoids the expansion of these entities.

<script type="text/javascript">

<![CDATA[

... unescaped script content ...

]]>

</script>

CDATA sections are recognized by the XML processor and appear as nodes in the Document Object Model, see Section 1.3 of the DOM Level 1 Recommendation [DOM].

An alternative is to use external script and style documents.

4.8. Script and Style elements

Modifié 7 Février 2005 par petit-ourson

[Denis]

Pourquoi ne pas simplement mettre ton javascript dans un fichier externe ?

[Antoine Cailliau]

Encore faut-il pouvoir fournir le type application/xhtml+xml ce qui n'est pas toujours possible

[Sylvain Trovalet]

Encore faut-il pouvoir fournir le type application/xhtml+xml ce qui n'est pas toujours possible

<{POST_SNAPBACK}>

Dans ce cas autant faire une page en HTML 4.01 strict et dans ce cas

<!--
//-->

suffit largement

Sinon pour du XHTML (ayant logiquement un syntaxe proche du XML) alors:

// <![CDATA[ 
//]]>

En réponse à Denis :

Je pense qu'il peut être intéressant de connaitre cette façon d'insérer le code pour certains cas spécifiques, mais ne t'inquiète pas, je suis pour une séparation maximale entre HTML, CSS et JavaScript

[Denis]

mais ne t'inquiète pas, je suis pour une séparation maximale entre HTML, CSS et JavaScript

Ouf, me voilà qui respire mieux !

[Ganf]

Je me permet de corriger une chose :

Sauf erreur de ma part, théoriquement, le commentaire est faux en HTML 4 / SGML aussi (pas que en XML). Oui c'est valide, mais ça revient tout simplement à ignorer tout le contenu, donc normalement le script js n'est pas interprêté. De manière plus concrête ça interdit aussi d'avoir une suite de deux tirets consécutifs dans le code (donc pas de décrémentation).

Le CDATA est lui bien valide en HTML comme en XML, avec les // il ne posera problème sur aucun navigateur, même les plus sensibles. De toutes façons je crois m'accorder avec ceux qui veulent mettre le js en externe. Pas pour une quelconque séparation (que ce soit dans le même fichier ou pas ne m'empêche nullement d'avoir une séparation des couches au niveau logique) mais plus parce que c'est tout de même bien pratique et plus agréable.

[annakin]

Le CDATA n'est valide que pour le XHTML et XML en aucun cas pour le HTML.

[Ganf]

Tu m'as mis un doute Annakin, alors je viens de vérifier. C'est bien une syntaxe qui vient de SGML, c'est donc bel est bien possible en HTML (qui marche sur du SGML). Pour confirmation pour ceux qui doutent j'en ai mis quelques uns dans un code HTML et il a tout à fait passé le validateur.

Le SGML est bien plus complet et complexe que ce qu'il n'y parait avec le HTML. Pour faire un résumé : le XML est une simplification du SGML, presque tout ce qui y existe existait déjà en SGML (souvent de manière plus complète). La seule exception importante que je vois c'est le mécanisme d'espace de nom.

[Monique]

Bonjour,

Je vois dans ton code que tu utilises :

<![CDATA[
...
//]]>

Quelle est l'utilité de cette balise ?

<{POST_SNAPBACK}>

Un billet très intéressant de Laurent Jouanneau (écrit à la suite de question à propos de Bien valider ses formulaires avec Javascript) : La section CDATA en Xml

A lire aussi : Les types de données HTML de base

La définition de type de document spécifie la syntaxe du contenu des éléments et des valeurs des attributa HTML en utilisant les atomes [ndt. tokens] SGML par exemple, PCDATA, CDATA, NAME, ID, etc.). Voir [iSO8879] pour obtenir leurs définitions complètes. Les lignes suivantes constituent un résumé des points-clés :

    * le type CDATA représente une séquence de caractères, issus du jeu de caractère du document, qui peut inclure des entités de caractères. Les agents utilisateurs devraient interpréter les valeurs d'attributs ainsi :

          o remplacer les entités de caractères par les caractères correspondants ;

          o ignorer les sauts de ligne ;

          o remplacer chaque retour chariot ou tabulation par un espace simple.