From 1407c8fdef01ecd0ffb8a8bd46e7113f119b9fde Mon Sep 17 00:00:00 2001 From: julieng Date: Sat, 2 Oct 2021 17:20:24 +0200 Subject: convert content to md --- files/fr/web/api/htmlimageelement/index.md | 229 ++++++++++++----------------- 1 file changed, 95 insertions(+), 134 deletions(-) (limited to 'files/fr/web/api/htmlimageelement/index.md') diff --git a/files/fr/web/api/htmlimageelement/index.md b/files/fr/web/api/htmlimageelement/index.md index cc2ab84054..07b28b66bc 100644 --- a/files/fr/web/api/htmlimageelement/index.md +++ b/files/fr/web/api/htmlimageelement/index.md @@ -3,85 +3,80 @@ title: HTMLImageElement slug: Web/API/HTMLImageElement translation_of: Web/API/HTMLImageElement --- -

{{APIRef("HTML DOM")}}

- -

L'interface  HTMLImageElement fournit des propriétés et des méthodes spéciales pour manipuler la mise en page et la présentation des éléments {{HTMLElement("img")}} .

- -

Propriétés

- -

Hérite les propriétés de son parent, {{domxref ("HTMLElement")}}

- -
-
{{domxref("HTMLImageElement.align")}} {{obsolete_inline}}
-
Est une {{domxref("DOMString")}} (chaîne de caractères) qui indique l'alignement de l'image en respectant le contexte environnant. Les valeurs possibles sont "left"(gauche), "right"(droite), "justify"(justifié), et "center"(centré) .
-
{{domxref("HTMLImageElement.alt")}}
-
Est une {{domxref("DOMString")}} (chaîne de caractères) qui reflète les attributs HTML {{htmlattrxref("alt", "img")}} , ceux-ci indiquant le recul du contexte de l'image.
-
{{domxref("HTMLImageElement.border")}} {{obsolete_inline}}
-
Est une {{domxref("DOMString")}} (chaîne de caractères) qui est responsable de la largeur de la bordure entourant l'image. Il est maintenant déprécié et la propriété CSS {{cssxref("border")}} est utilisée à la place.
-
{{domxref("HTMLImageElement.complete")}} {{readonlyInline}}
-
Retourne un {{domxref("Boolean")}} (booléen) qui est true (vrai) si le navigateur a fini de chercher l'image, que ce soit avec succès ou non. Il affiche aussi "true" si l'image n'a pas de valeur {{domxref("HTMLImageElement.src", "src")}} .
-
{{domxref("HTMLImageElement.crossOrigin")}}
-
Est une {{domxref("DOMString")}} (chaîne de caractères) représentant le paramètre CORS défini pour cet élément image. Voir Attributs de règlage du CORS pour plus de détails.
-
{{domxref("HTMLImageElement.currentSrc")}} {{readonlyInline}}{{experimental_inline}}
-
Retourne une {{domxref("DOMString")}} (chaîne de caractères) représentant l'URL de l'image courante affichée (qui peut changer, par exemple en réponse à une requête multimédia).
-
{{domxref("HTMLImageElement.height")}}
-
Est un unsigned long (non signé long) qui reflète l'attibut HTML {{htmlattrxref("height", "img")}} indiquant la hauteur du rendu de l'image en pixels CSS.
-
{{domxref("HTMLImageElement.hspace")}} {{obsolete_inline}}
-
Est un long représentant l'espace de chaque côté de l'image.
-
{{domxref("HTMLImageElement.isMap")}}
-
Est un {{domxref("Boolean")}} (booléen) qui reflète l'attribut HTML {{htmlattrxref("ismap", "img")}} indiquant que l'image fait partie d'une carte d'image côté serveur.
-
{{domxref("HTMLImageElement.longDesc")}} {{obsolete_inline}}
-
Est une {{domxref("DOMString")}} (chaîne de caractères) représentant l'URL d'une longue description de l'image.
-
{{domxref("HTMLImageElement.lowSrc")}} {{obsolete_inline}}
-
Est une {{domxref("DOMString")}}  (chaîne de caractères) qui fait référence à une copie de faible qualité (mais plus rapide à charger) de l'image.
-
{{domxref("HTMLImageElement.name")}} {{obsolete_inline}}
-
Est une {{domxref("DOMString")}} (chaîne de caractères) représentant le nom de l'élément.
-
{{domxref("HTMLImageElement.naturalHeight")}} {{readonlyInline}}
-
Retourne un unsigned long  représentant la hauteur intrinsèque de l'image en pixels CSS, si elle est disponible ; sinon, 0 est affiché.
-
{{domxref("HTMLImageElement.referrerPolicy")}} {{experimental_inline}}
-
Est une {{domxref("DOMString")}} (chaîne de caractères) qui reflète l'attribut HTML {{htmlattrxref("referrerpolicy", "img")}}  indiquant la référence à utiliser pour récupérer l'image.
-
{{domxref("HTMLImageElement.src")}}
-
Est une {{domxref("DOMString")}} (chaîne de caractères) qui reflète l'attribut HTML  {{htmlattrxref("src", "img")}} contenant l'URL complète de l'image y compris l'URI de base.
-
{{domxref("HTMLImageElement.sizes")}} {{experimental_inline}}
-
Est une {{domxref("DOMString")}} (chaîne de caractères) reflétant l'attribut HTML {{htmlattrxref("sizes", "img")}} (taille).
-
{{domxref("HTMLImageElement.srcset")}} {{experimental_inline}}
-
Est une {{domxref("DOMString")}} (chaîne de caractères) reflétant l'attribut HTML {{htmlattrxref("srcset", "img")}} , qui contient une liste d'images candidates, séparées par une virgule. Une image candidate est une URL suivie d'un 'w'  avec la largeur de l'image ou d'un 'x'  avec la densité en pixels.
-
{{domxref("HTMLImageElement.useMap")}}
-
Est une {{domxref("DOMString")}} (chaîne de caractères) qui reflète l'attribut HTML {{htmlattrxref("usemap", "img")}} contenant une URL partielle d'un élément "map" (carte).
-
{{domxref("HTMLImageElement.vspace")}} {{obsolete_inline}}
-
Est un long représentant l'espace au-dessus et en-dessous de l'image.
-
{{domxref("HTMLImageElement.width")}}
-
Est un unsigned long qui reflète l'attribut HTML {{htmlattrxref("width", "img")}} indiquant la largeur rendue de l'image en pixels CSS.
-
{{domxref("HTMLImageElement.x")}} {{readonlyInline}}{{experimental_inline}}
-
Retourne un long  représentant le décalage horizontal à partir de la couche la plus proche. Cette propriété imite un comportement ancien de Netscape 4.
-
{{domxref("HTMLImageElement.y")}} {{readonlyInline}} {{experimental_inline}}
-
Retourne un long représentant le décalage vertical à partir de la couche la plus proche. Cette propriété imite un comportement ancien de Netscape 4.
-
- -

Méthodes

- -

Hérite les propriétés de son parent, {{domxref("HTMLElement")}}.

- -
-
{{domxref("HTMLImageElement.Image()", "Image()")}}
-
Le constructeur d'image, comprend deux propriétés unsigned  et long , qui sont la largeur et la hauteur de la ressource, et crée une instance de HTMLImageElement , non insérée dans une arborescence DOM.
-
- -

Erreurs

- -

Si une erreur apparaît pendant un essai de chargement ou de rendu de l'image, et si un gestionnaire d'évènements {{htmlattrxref("onerror")}} a été configuré pour gérer les évènements {{event("error")}} , ce gestionnaire est appelé. Cela peut se produire dans un certain nombre de situations, y compris :

- - - -

Exemple

- -
var img1 = new Image(); //  Constructeur HTML5
+{{APIRef("HTML DOM")}}
+
+L'interface  **`HTMLImageElement`** fournit des propriétés et des méthodes spéciales pour manipuler la mise en page et la présentation des éléments {{HTMLElement("img")}} .
+
+## Propriétés
+
+_Hérite les propriétés de son parent, {{domxref ("HTMLElement")}}_
+
+- {{domxref("HTMLImageElement.align")}} {{obsolete_inline}}
+  - : Est une {{domxref("DOMString")}} _(chaîne de caractères)_ qui indique l'alignement de l'image en respectant le contexte environnant. Les valeurs possibles sont `"left"`_(gauche)_, `"right"`_(droite)_, `"justify"`_(justifié)_, et `"center"`_(centré) ._
+- {{domxref("HTMLImageElement.alt")}}
+  - : Est une {{domxref("DOMString")}} _(chaîne de caractères)_ qui reflète les attributs HTML {{htmlattrxref("alt", "img")}} , ceux-ci indiquant le recul du contexte de l'image.
+- {{domxref("HTMLImageElement.border")}} {{obsolete_inline}}
+  - : Est une {{domxref("DOMString")}} _(chaîne de caractères)_ qui est responsable de la largeur de la bordure entourant l'image. Il est maintenant déprécié et la propriété CSS {{cssxref("border")}} est utilisée à la place.
+- {{domxref("HTMLImageElement.complete")}} {{readonlyInline}}
+  - : Retourne un {{domxref("Boolean")}} _(booléen)_ qui est `true` _(vrai)_ si le navigateur a fini de chercher l'image, que ce soit avec succès ou non. Il affiche aussi "true" si l'image n'a pas de valeur {{domxref("HTMLImageElement.src", "src")}} .
+- {{domxref("HTMLImageElement.crossOrigin")}}
+  - : Est une {{domxref("DOMString")}} _(chaîne de caractères)_ représentant le paramètre CORS défini pour cet élément image. Voir [Attributs de règlage du CORS](/fr/docs/Web/HTML/Reglages_des_attributs_CORS) pour plus de détails.
+- {{domxref("HTMLImageElement.currentSrc")}} {{readonlyInline}}{{experimental_inline}}
+  - : Retourne une {{domxref("DOMString")}} *(chaîne de caractères)* représentant l'URL de l'image courante affichée (qui peut changer, par exemple en réponse à une requête multimédia).
+- {{domxref("HTMLImageElement.height")}}
+  - : Est un `unsigned long` _(non signé long)_ qui reflète l'attibut HTML {{htmlattrxref("height", "img")}} indiquant la hauteur du rendu de l'image en pixels CSS.
+- {{domxref("HTMLImageElement.hspace")}} {{obsolete_inline}}
+  - : Est un `long` représentant l'espace de chaque côté de l'image.
+- {{domxref("HTMLImageElement.isMap")}}
+  - : Est un {{domxref("Boolean")}} _(booléen)_ qui reflète l'attribut HTML {{htmlattrxref("ismap", "img")}} indiquant que l'image fait partie d'une carte d'image côté serveur.
+- {{domxref("HTMLImageElement.longDesc")}} {{obsolete_inline}}
+  - : Est une {{domxref("DOMString")}} *(chaîne de caractères)* représentant l'URL d'une longue description de l'image.
+- {{domxref("HTMLImageElement.lowSrc")}} {{obsolete_inline}}
+  - : Est une {{domxref("DOMString")}}  *(chaîne de caractères)* qui fait référence à une copie de faible qualité (mais plus rapide à charger) de l'image.
+- {{domxref("HTMLImageElement.name")}} {{obsolete_inline}}
+  - : Est une {{domxref("DOMString")}} *(chaîne de caractères)* représentant le nom de l'élément.
+- {{domxref("HTMLImageElement.naturalHeight")}} {{readonlyInline}}
+  - : Retourne un `unsigned long`  représentant la hauteur intrinsèque de l'image en pixels CSS, si elle est disponible ; sinon, 0 est affiché.
+- {{domxref("HTMLImageElement.referrerPolicy")}} {{experimental_inline}}
+  - : Est une {{domxref("DOMString")}} *(chaîne de caractères)* qui reflète l'attribut HTML {{htmlattrxref("referrerpolicy", "img")}}  indiquant la référence à utiliser pour récupérer l'image.
+- {{domxref("HTMLImageElement.src")}}
+  - : Est une {{domxref("DOMString")}} *(chaîne de caractères)* qui reflète l'attribut HTML  {{htmlattrxref("src", "img")}} contenant l'URL complète de l'image y compris l'URI de base.
+- {{domxref("HTMLImageElement.sizes")}} {{experimental_inline}}
+  - : Est une {{domxref("DOMString")}} *(chaîne de caractères)* reflétant l'attribut HTML {{htmlattrxref("sizes", "img")}} _(taille)_.
+- {{domxref("HTMLImageElement.srcset")}} {{experimental_inline}}
+  - : Est une {{domxref("DOMString")}} *(chaîne de caractères)* reflétant l'attribut HTML {{htmlattrxref("srcset", "img")}} , qui contient une liste d'images candidates, séparées par une virgule. Une image candidate est une URL suivie d'un `'w'`  avec la largeur de l'image ou d'un `'x'`  avec la densité en pixels.
+- {{domxref("HTMLImageElement.useMap")}}
+  - : Est une {{domxref("DOMString")}} *(chaîne de caractères)* qui reflète l'attribut HTML {{htmlattrxref("usemap", "img")}} contenant une URL partielle d'un élément "map" _(carte)_.
+- {{domxref("HTMLImageElement.vspace")}} {{obsolete_inline}}
+  - : Est un `long` représentant l'espace au-dessus et en-dessous de l'image.
+- {{domxref("HTMLImageElement.width")}}
+  - : Est un `unsigned long` qui reflète l'attribut HTML {{htmlattrxref("width", "img")}} indiquant la largeur rendue de l'image en pixels CSS.
+- {{domxref("HTMLImageElement.x")}} {{readonlyInline}}{{experimental_inline}}
+  - : Retourne un `long`  représentant le décalage horizontal à partir de la couche la plus proche. Cette propriété imite un comportement ancien de Netscape 4.
+- {{domxref("HTMLImageElement.y")}} {{readonlyInline}} {{experimental_inline}}
+  - : Retourne un `long` représentant le décalage vertical à partir de la couche la plus proche. Cette propriété imite un comportement ancien de Netscape 4.
+
+## Méthodes
+
+_Hérite les propriétés de son parent, {{domxref("HTMLElement")}}._
+
+- {{domxref("HTMLImageElement.Image()", "Image()")}}
+  - : Le constructeur d'image, comprend deux propriétés `unsigned`  et `long` , qui sont la largeur et la hauteur de la ressource, et crée une instance de `HTMLImageElement` , non insérée dans une arborescence DOM.
+
+## Erreurs
+
+Si une erreur apparaît pendant un essai de chargement ou de rendu de l'image, et si un gestionnaire d'évènements {{htmlattrxref("onerror")}} a été configuré pour gérer les évènements {{event("error")}} , ce gestionnaire est appelé. Cela peut se produire dans un certain nombre de situations, y compris :
+
+- L'attribut  {{htmlattrxref("src", "img")}} est vide ou `null`.
+- L'URL spécifiée de `src`  est la même que l'URL de la page actuelle de l'utilisateur.
+- L'image spécifiée est corrompue de telle manière qu'elle ne peut être chargée.
+- Les métadonnées de l'image spécifiée sont corrompues empêchant de récupérer ses dimensions,  et aucune dimension n'est spécifiée dans les attributs de l'élément ``.
+- L'image spécifiée est dans un format non supporté par l'"{{Glossary("user agent")}}".
+
+## Exemple
+
+```js
+var img1 = new Image(); //  Constructeur HTML5
 img1.src = 'image1.png';
 img1.alt = 'alt';
 document.body.appendChild(img1);
@@ -92,58 +87,24 @@ img2.alt = 'alt text';
 document.body.appendChild(img2);
 
 // en utilisant la première image dans le document
-alert(document.images[0].src);
- -

Spécifications

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
SpécificationStatutCommentaire
{{SpecName('Referrer Policy', '#referrer-policy-delivery-referrer-attribute', 'referrer attribute')}}{{Spec2('Referrer Policy')}}Ajoute la propriété referrerPolicy .
{{SpecName("CSSOM View", "#excensions-to-the-htmlimageelement-interface", "Extensions to HTMLImageElement")}}{{Spec2('CSSOM View')}}Ajoute les propriétés x ety .
{{SpecName('HTML WHATWG', "embedded-content.html#the-img-element", "HTMLImageElement")}}{{Spec2('HTML WHATWG')}}Les propriétés suivantes sont ajoutées : srcset, currentSrc et sizes.
{{SpecName('HTML5 W3C', "embedded-content-0.html#the-img-element", "HTMLImageElement")}}{{Spec2('HTML5 W3C')}}Un constructeur (avec 2 paramètres facultatifs) est ajouté.
- Les propriétés suivantes sont maintenant obsolètes : name, border, align, hspace, vspace, et longdesc.
- Les propriétés suivantes sont maintenant unsigned et long, iau lieu de long: height et width.
- Les propriétés suivantes ont été ajoutées : crossorigin, naturalWidth, naturalHeight et complete.
{{SpecName('DOM2 HTML', 'html.html#ID-17701901', 'HTMLImgElement')}}{{Spec2('DOM2 HTML')}}La propriété lowSrc a été supprimée.
- La propriété est maintenant long, au lieu des DOMString: height, width, hspace et vspace.
{{SpecName('DOM1', 'level-one-html.html#ID-17701901', 'HTMLImgElement')}}{{Spec2('DOM1')}}définition initiale.
- -

Compatibilité des navigateurs

- -

{{Compat("api.HTMLImageElement")}}

- -

Voir aussi

- -

L'élément HTML implémentant cette interface : {{HTMLElement("img")}}

+alert(document.images[0].src); +``` + +## Spécifications + +| Spécification | Statut | Commentaire | +| ------------------------------------------------------------------------------------------------------------------------------------------------ | ------------------------------------ | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | +| {{SpecName('Referrer Policy', '#referrer-policy-delivery-referrer-attribute', 'referrer attribute')}} | {{Spec2('Referrer Policy')}} | Ajoute la propriété `referrerPolicy` . | +| {{SpecName("CSSOM View", "#excensions-to-the-htmlimageelement-interface", "Extensions to HTMLImageElement")}} | {{Spec2('CSSOM View')}} | Ajoute les propriétés `x` et`y` . | +| {{SpecName('HTML WHATWG', "embedded-content.html#the-img-element", "HTMLImageElement")}} | {{Spec2('HTML WHATWG')}} | Les propriétés suivantes sont ajoutées : `srcset`, `currentSrc` et `sizes`. | +| {{SpecName('HTML5 W3C', "embedded-content-0.html#the-img-element", "HTMLImageElement")}} | {{Spec2('HTML5 W3C')}} | Un constructeur (avec 2 paramètres facultatifs) est ajouté. Les propriétés suivantes sont maintenant obsolètes : `name`, `border`, `align`, `hspace`, `vspace`, et `longdesc`. Les propriétés suivantes sont maintenant `unsigned et long`, iau lieu de `long`: `height` et `width`. Les propriétés suivantes ont été ajoutées : `crossorigin`, `naturalWidth`, `naturalHeight` et `complete`. | +| {{SpecName('DOM2 HTML', 'html.html#ID-17701901', 'HTMLImgElement')}} | {{Spec2('DOM2 HTML')}} | La propriété `lowSrc` a été supprimée. La propriété est maintenant `long`, au lieu des `DOMString`: `height`, `width`, `hspace` et `vspace`. | +| {{SpecName('DOM1', 'level-one-html.html#ID-17701901', 'HTMLImgElement')}} | {{Spec2('DOM1')}} | définition initiale. | + +## Compatibilité des navigateurs + +{{Compat("api.HTMLImageElement")}} + +## Voir aussi + +L'élément HTML implémentant cette interface : {{HTMLElement("img")}} -- cgit v1.2.3-54-g00ecf