web-dev-qa-db-fra.com

Obtenir la source d'un élément d'image spécifique avec jQuery

J'ai beaucoup d'éléments d'image et je veux obtenir la source d'une image spécifique où le texte alternatif est "exemple" .

J'ai essayé ceci:

var src = $('.conversation_img').attr('src');

mais je ne peux pas obtenir celui dont j'ai besoin avec ça.

Comment sélectionner un élément d'image spécifique en fonction de son texte alternatif?

jqueryjquery-selectors
27
Irakli Lekishvili

Pour sélectionner un élément où vous ne connaissez que la valeur d'attribut, vous pouvez utiliser le script jQuery ci-dessous. 

var src = $('.conversation_img[alt="example"]').attr('src');

Veuillez vous référer à Documentation jQuery pour l'attribut est égal à sélecteurs 

Veuillez également vous reporter à l'exemple de Démo

Vous trouverez ci-dessous le code si vous ne pouvez pas accéder à la démonstration.

HTML 

<div>
    <img alt="example" src="\images\show.jpg" />
    <img  alt="exampleAll" src="\images\showAll.jpg" />  

</div>

SCRIPT JQUERY 

var src = $('img[alt="example"]').attr('src');
alert("source of image with alternate text = example - " + src);


var srcAll = $('img[alt="exampleAll"]').attr('src');
alert("source of image with alternate text = exampleAll - " + srcAll );

La sortie sera 

Deux messages d'alerte ayant chacun des valeurs 

  1. source de l'image avec texte alternatif = exemple -\images\show.jpg
  2. source de l'image avec texte alternatif = exampleAll -\images\showAll.jpg
55
Murtaza
$('img.conversation_img[alt="example"]')
    .each(function(){
         alert($(this).attr('src'))
    });

Ceci affichera les attributs src de toutes les images de la classe 'conversation_img' avec alt = 'example'

7
strah
var src = $('img.conversation_img[alt="example"]').attr('src');

Si vous avez plusieurs éléments correspondants, seul le src du premier sera renvoyé.

2
ThiefMaster

Si vous n'avez pas spécifiquement besoin du texte alternatif d'une image, vous pouvez simplement cibler la classe/id de l'image.

$('img.propImg').each(function(){ 
     enter code here
}

Je sais que cela ne répond pas tout à fait à la question, même si j’avais passé beaucoup de temps à essayer de comprendre cela et cette question m’a apporté la solution :) Dans mon cas, je devais cacher toutes les balises d'image avec un src spécifique.

$('img.propImg').each(function(){ //for each loop that gets all the images. 
        if($(this).attr('src') == "img/{{images}}") { // if the src matches this
        $(this).css("display", "none") // hide the image.
    }
});
0
Wonx2150