HTMLLinkElement : propriété imageSrcset

Baseline Large disponibilité

Cette fonctionnalité est bien établie et fonctionne sur de nombreux appareils et versions de navigateurs. Elle est disponible sur tous les navigateurs depuis décembre 2023.

En savoir plus
Voir la compatibilité complète

La propriété imageSrcset de l'interface HTMLLinkElement est une chaîne de caractères qui identifie une ou plusieurs chaînes candidates d'image séparées par des virgules. Cette propriété reflète la valeur de l'attribut imagesrcset de l'élément HTML <link>. Cette propriété permet d'obtenir ou de définir la valeur de l'attribut imagesrcset.

Chaque chaîne candidate d'image contient une URL d'image et un descripteur optionnel de largeur et/ou de densité de pixels indiquant les conditions dans lesquelles cette image candidate doit être utilisée.

"images/team-photo.jpg, images/team-photo-retina.jpg 2x, images/team-photo-large.jpg 1400w"

Pour les éléments HTML <link> avec rel="preload" et as="image", l'attribut imagesrcset a une syntaxe et une sémantique similaires à l'attribut srcset de l'élément <img>, qui indique de précharger la ressource appropriée utilisée par un élément <img> avec des valeurs correspondantes pour ses attributs srcset et sizes.

Si la propriété imageSrcset inclut des descripteurs de largeur, la propriété imageSizes doit être non nulle, sinon la valeur de imageSrcset sera ignorée.

Valeur

Une chaîne de caractères composée d'une liste séparée par des virgules d'une ou plusieurs chaînes candidates d'image, ou la chaîne de caractères vide "" si non spécifiée.

Exemples

Given the following <link> element:

html

<link
  rel="preload"
  as="image"
  imagesizes="50vw"
  imagesrcset="bg-narrow.png, bg-wide.png 800w" />

<pre id="log"></pre>

#log {
  padding: 0 0.25rem;
  font-size: 1.2em;
  line-height: 1.4;
}

const logElement = document.querySelector("#log");
function log(text) {
  logElement.innerText = `${logElement.innerText}${text}\n`;
  logElement.scrollTop = logElement.scrollHeight;
}

…on peut accéder à la valeur de l'attribut imagesrcset, et la modifier, en utilisant la propriété imageSrcset :

const link = document.querySelector("link");
log(`Original: ${link.imageSrcset}`);

// ajouter une chaîne candidate d'image
link.imageSrcset += ", bg-huge.png 1200w";
log(`Mis à jour : ${link.imageSrcset}`);

Spécifications

Spécification
HTML # dom-link-imagesrcset

Compatibilité des navigateurs

Voir aussi

La propriété HTMLLinkElement.imageSizes
La propriété HTMLImageElement.srcset
Chargement spéculatif
Images adaptatives

Aider à améliorer MDN

Apprendre à contribuer

Cette page a été modifiée le 7 oct. 2025 par les contributeur·ice·s du MDN.

Voir cette page sur GitHub • Signaler un problème avec ce contenu