IFT 1005 - Design et développement Web

3. XML

Sébastien Roy, Université de Montréal

IFT 1005 - Design et développement Web

3. XML

Sébastien Roy, Université de Montréal
30 janvier 2023
 

Balisage

Enrichissement d’un document pour en indiquer...

et en faciliter le traitement.

Via des balises (tags), distinguables du texte:

Évolution

GML

General Markup Language

1967....«séparer le fond du document par rapport à sa forme»
Commercialisé en 1980
On reconnait des balises...

            :BODY.
            :H1.
            :TABLE.
            ...
        

SGML

Standardized General Markup Language

Et le XML?

Sans balise, on ne peut pas extraire le sens du contenu...

Balisage XML

Sert de base pour différents langages de description de données

<auteur naissance="1802" mort="1885">
<nom>Hugo</nom>
<prenom>Victor</prenom>
</auteur>

Balisage sémantique

La balise est utilisée pour décrire le sens, pas l'apparence.

XML orienté données (data oriented)


<note>
  <to>Tove</to>
  <from>Jani</from>
  <heading>Reminder</heading>
  <body>Don't forget me this weekend!</body>
</note>
La météo... https://w1.weather.gov/xml/current_obs/KALB.xml ( original )

XML orienté document d’auteurs

Information liée à un document

<ARTICLE>
  <HEADLINE>Fredrick the Great meets Bach</HEADLINE>
  <AUTHOR>Johann Nikolaus Forkel</AUTHOR>
  <PARA>
    One evening, just as he was getting his
    <INSTRUMENT>flute</INSTRUMENT> ready and his
        musicians were assembled, an officer brought him a list of
    the strangers who had arrived.
  </PARA>
</ARTICLE>
    

Différence entre XML et HTML

XML : Éléments

Balise d’ouverture doit avoir une balise de fermeture correspondante

<elem> ...contenu... </elem>

<elem/> identique à <elem></elem>

Attention Il faut préserver l'imbrication....

XML : Éléments

Les balises doivent s'imbriquer correctement

<auteur> <prénom> Sébastien </prénom> <nom> Roy </nom> </auteur>

Ne pas faire:
<prénom> Sébastien <nom> Roy </prénom> </nom>

XML : Éléments

Nom d'un élément

XML : Choisir ses Éléments

Voyons ces exemples... Lequel est le meilleur?


<étudiant>
  <nom>Sébastien Roy</nom>
</étudiant>
    

<étudiant>
  <nom>Roy</nom>
  <prénom>Sébastien</nom>
</étudiant>
    

XML : Choisir ses Éléments

Voyons ces exemples... Lequel est le meilleur?


<date>
  <jour>30</jour>
  <mois>1</mois>
  <année>2023</année>
</date>
    

<date>2023-1-30</date>
    

XML : Choisir ses Éléments

Le choix dépend entièrement de l'utilisation prévue. L'information...

XML : Attributs

<étudiant unip="roys">

XML : Attributs vs Élément

Voyons ces exemples... Sont-ils équivalents?


<étudiant unip="roys">
  <nom>Roy</nom>
  <prénom>Sébastien</prénom>
</étudiant>
    

<étudiant>
  <unip>roys</unip>
  <nom>Roy</nom>
  <prénom>Sébastien</prénom>
</étudiant>
    

<étudiant unip="roys" nom="Roy" prénom="Sébastien">
</étudiant>
    

XML : Attributs vs Élément

Un règle non écrite...

Si c'est destiné à être affiché, utiliser un élément.


<étudiant unip="roys">
  <nom>Roy</nom>
  <prénom>Sébastien</prénom>
</étudiant>
    
est probablement la meilleure solution ici. Regardons KALBsimple.xml

XML : Entités

On doit parfois utiliser des entités (&...;)
Caractère réservéremplacer par
< &lt;
> &gt;
" &quote;
' &apos;
& &amp;
<équation>1 &lt; 2</équation>

XML : Le document complet

    
    
    
    

XML : Autres détails

Comment afficher du XML?

  1. Le navigateur fait ce qu'il veut... (KALBsimple.xml)
  2. On donne une feuille de style CSS ( doc.xml)
  3. On transforme le xml en html (KALBmini.xml)
https://w1.weather.gov/xml/current_obs/latest_ob.xsl

Feuille de style CSS

Pas une bonne facon d'afficher du XML, mais c'est rigolo... exemple : modern.css

Mais c'est la base de l'affichage en HTML, alors c'est important

Feuille de style XSL

eXtensible Stylesheet Language

Très très puissant, mais un peu intense...

XSLT

... et ca utilise XSLT, Xpath et xQuery.

Intro à XSLT ici: W3S

XSLT

eXtensible Stylesheet Language Transformation

Permet de transformer du xml en autre chose (comme du html, par exemple).

Basé sur un concept de template

Par ici.... https://www.w3schools.com/xml/xsl_transformation.asp
Reference complete

Template?

Un template est un patron... on peut y remplacer certaines informations, essentiellement.
Plus simple exemple, la lettre personalisée...
En XSLT, on va créer su HTML (ou du pdf, ou du texte, ou autre).

XSLT - Transformations

Voici la référence transformation

Xpath - identification d'éléments XML

Intro a xpath
Structure (arbre) d'une XML

XSLT

On va expérimenter un peu... XSL en direct!

Validation

Le xml doit être validé...

Validation