Come posso selezionare tutti i collegamenti alle immagini in Prototype

Question

Sono abituato a jQuery, ma ho bisogno di usare il framework Prototype per questo progetto. Ho una lista di immagini (jpg, png e gif), alcune delle quali hanno collegamenti con il tag <a>. Devo aggiungere un attributo rel solo a quei tag <a> che sono collegamenti diretti a jpg, gif e png. Gli href non hanno uno stile simile diverso da finire in .jpg, .png o .gif. Posso aggiungere il rel a un singolo link con href specifico, ma non riesco a capire come selezionare tutti questi link. Un esempio dei collegamenti che hanno bisogno di essere manipolato:

<a href="images/01.jpg"><img src="images/01.jpg" width="500" /></a> 
<br> 
<a href="http://www.example.com/"><img src="images/02.jpg" width="500"></a> 
<br> 
<a href="images/03.png"><img src="images/03.png" width="500" /></a> 
<br> 
<img src="images/04.jpg" width="500"> 
<br> 

E il risultato desiderato:

<a href="images/01.jpg" rel="whatever"><img src="images/01.jpg" width="500" /></a> 
<br> 
<a href="http://www.example.com/"><img src="images/02.jpg" width="500"></a> 
<br> 
<a href="images/03.png" rel="whatever"><img src="images/03.png" width="500" /></a> 
<br> 
<img src="images/04.jpg" width="500"> 
<br> 

immagino che il codice finale sarà simile:

<script type="text/javascript"> 
Event.observe(window, 'load', function() { 
    $$('a[href="*.jpg","*.png"]').each(function(link){ 

      link.writeAttribute('rel','whatever'); 

    }); 
}); 
</script> 

Ma io impossibile ottenere il carattere jolly (*) per funzionare correttamente. Come si usa un carattere jolly nel prototipo?

Answer 1

Il prototipo non supporta l'utilizzo di caratteri jolly del genere, ma consente di associare la fine di un valore utilizzando lo $=attribute selector.

$$('a[href$=.jpg], a[href$=.png], a[href$=.gif]').each(function(link){