5244 sujets

Sémantique web et HTML

Bonjour,
Y a-t-il un attribut de "img" où l'on peut mettre du texte qui ne s'affichera pas mais que l'on peut récupérer en JS ?
Merci !
Modérateur
Et l'eau,

alt.... Sinon data-quelquechoz. Mais pourquoi veux tu le récupérer en js ?
Merci !
Alt je l'ai déjà utilisé.
niuxe a écrit :
Sinon data-quelquechoz

C'est à dire ?
On peut mettre un truc genre :
<img src="cactus.png" alt="cactus vert piquant" data-description="Un cactus est vert. Ça pique. C'est souvent dans le désert" id="cactus">

? Et on peut récupérer la description avec
var description=cactus.data-description
?

C'est ça ?
Meilleure solution
Modérateur
En gros c'est l'idée,

avec une structure HTML redondante, tu peut faire une boucle sans te soucier de donner une id à chaque image :

ex sur une structure :
<figure>
    <img alt data-description src >
    <figcaption></figcaption>
</figure>

et la boucle
let pot = document.querySelectorAll("figure");
for (i = 0; i < pot.length; i++) {
  let plante = pot[i].querySelector("img");
  let etiquette = pot[i].querySelector("figcaption");
  let text = plante.getAttribute("data-description");
  etiquette.textContent = text;
  pot[i].setAttribute('title',plante.getAttribute("alt") )// une fois le contenu récupere il peut-etre reinjecter ou stocké , ex un title sur figure
}


https://codepen.io/gc-nomade/pen/vYKwmwX?editors=1010
Modifié par gcyrillus (19 Nov 2020 - 15:22)