Lycée Rafèha Attribut HTML : pattern

L'attribut pattern indique une expression rationnelle(régulière) que doit respecter la valeur du contrôle du formulaire.
L'attribut pattern peut être utilisé pour les champs de type text, tel, email, url, password, search.
On pourra utiliser l'attribut title afin de fournir aux utilisateurs des explications quant aux règles à respecter pour que la
valeur soit valide.
Caractères spéciaux utilisables pour les expressions régulières
Caractère Signification
. Par défaut, (Le point) correspond à n'importe quel caractère excepté un caractère de saut de ligne.

[xyz] Un ensemble de caractère. Ce type de motif correspond pour n'importe quel caractètre présent entre les crochets, y compris
les séquences d'échappement. Les caractères spéciaux comme le point (.) et l'astérisque ne sont pas considérés comme
spéciaux au sein d'un ensemble et n'ont donc pas besoin d'être échappés. Il est possible de donner un ensemble sur un
intervalle de caractères en utilisant un tiret (-), comme le montre l'exemple qui suit.
Le motif [a-d], aura les mêmes correspondances que [abcd], correspondant au 'b' de "bulle" et au 'c' de "ciel". Les
motifis /[a-z.]+/ et /[\w.]+/ correspondront pour la chaîne entirère : "[Link].e".
[^xyz] Exclusion d'un ensemble de caractères. Cela correspond à tout ce qui n'est pas compris entre crochets. Il est possible
de fournir un intervalle de caractères en utilisant un tiret (-). Les autres règles qui s'appliquent pour l'ensemble de
caractères (ci-avant) s'appliquent également ici. Par exemple, [^abc] est équivalent à [^a-c].

Ils correspondent à 'u' dans "bulle" et à 'i' dans "ciel".

x|y Correspond à 'x' ou 'y'.Ainsi, /vert|rouge/ correspond à 'vert' dans "feu vert" et à 'rouge' dans "feu rouge"

\w Correspond à n'importe quel caractère alphanumérique, y compris le tiret bas.

C'est équivalent à [A-Za-z0-9_]

\W Correspond à n'importe quel caractère n'étant pas un caractère de mot.

Cela est équivalent à [^A-Za-z0-9_]
\d Correspond à un chiffre et est équivalent à [0-9]

\D Correspond à tout caractère qui n'est pas un chiffre et est équivalent à [^0-9]

\s Correspond à un blanc (cela comprend les espace, tabulation, saut de ligne ou saut de page).

Enseignant :[Link] Page 1

 C'est équivalent à [ \f\n\r\t\v\u00a0\u1680\u2000-\u200a\u2028\u2029\u202f\u205f\u3000\ufeff]
\S Correspond à un caractère qui n'est pas un blanc.
C'est équivalent à [^ \f\n\r\t\v\u00a0\u1680\u2000-\u200a\u2028\u2029\u202f\u205f\u3000\ufeff]

Comptage
Correspond pour exactement n occurences de l'expression précédente. N doit être un entier positif.
{n} Ainsi, /a{2}/ ne correspond pas au 'a' de "Mozilla" mais correspond à tous les 'a' de "Mozilaa" et aux deux premiers 'a' de
"Mozillaaa".

{n,} Correspond lorsqu'il y a au moins n occurences de l'expression précédente. n doit être un entier [Link]
exemple /a{2,}/ correspondra à "aa" ou à "aaa" ou encore à "aaaa" mais pas à "a".
{n,m} Lorsque n et m sont des entiers positifs, cela correspond à au moins n occurences de l'expression précédente et à au
plus m occurrences. Lorsque m n'est pas utilisé, la valeur par défaut correspondante sera l'infini.
Ainsi, /a{1,3}/ ne correspond à rien dans "Mozill", au 'a' de "Mozilla", au deux premiers 'a' de "Mozillaa" et au trois
premiers 'a' de "Mozillaaaaa". Pour ce dernier exemple, on doit noter que le correspondance ne se fait que sur "aaa"
bien qu'il y ait plus de 'a' dans la chaîne de caractères.
Correspond à la fin de la séquence.
$
Correspond à l'expression précédente qui est répétée 0 ou plusieurs fois. Équivalent à {0,}
*
Correspond à l'expression précédente qui est répétée une ou plusieurs fois. C'est équivalent à {1,}
+
Correspond à l'expression précédente qui est présente une fois ou pas du tout. C'est équivalent à {0,1}
?
Remarque Si on veut utiliser les caractères + ou * ou ? ou $ il suffit de l’échapper par \
Par exemple :
Expression régulière Signification du test
a\+b a+b
a+b aaaab(Au moins un a suivi d’un seul b)
Exemple d’utilisation :
<input type="email" id="np" name= "np" required <input
pattern="\w{2,30}@[a-z0-9]{2,10}\.(tn|com|[Link])$" type="tel" name="tel" id="tel" required
title="Champ faux, veuillez respecter la forme suivante pattern="(00216|\+216) (2|3|4|5|9)\d{1} \d{3} \d{3}$"
adresse@[Link] (domaine peut être soit tn ou com ou title="Numéro de téléphone doit commencer par
[Link]) avec adresse de taille entre 2 et 30 et serveur de +216 Xx yyy zzz dont X est 2 ou 3 ou 4 ou 5 ou 9" />
taille entre 2 et 10">