如何通過選擇標題的一部分來選擇圖像？

Question

希望你能幫助我解決我的問題。

這兩個圖像鏈接到某個網站的某個地方。

<a href="?FRUIT=banana><img height="40" src="../../banana.jpg?format=raw" title="Banana - yellow"></a> 

<a href="?FRUIT=apple><img height="40" src="../../apple.jpg?format=raw" title="Apple - green"></a>

我想邊框他們開始寫一個函數。

正如你所看到的每個圖像的標題包含水果和聽到水果時應該關聯的顏色。我開始創建數組。

var colors = ['yellow','green'];

數組的每個元素都應該用3px點綴綠色。

for(var i = 0;i < colors.length;i++){ 
.css('border','3px dotted green'); 
}

但是，如何獲得包含顏色的圖像的標題，以3px點綴的綠色爲邊界？

預先感謝您。

Answer 1

for(var i = 0;i < fruits.length;i++){ 
$('img[title$='+fruits[i]+']').css('border','3px dotted green'); 
var title = $('#'+fruits[i]).attr('title'); 
} 

這是如何獲得標題，並將邊界所有圖像哪些標題以水果數組中的任何顏色結束。

Answer 2

爲了清楚起見，使用對象來引用水果名稱的顏色可能會更好。

var fruit_colors = {Banana: "yellow", Apple: "red", Lime: "green", Grape: "purple"}; 
for(k in fruit_colors){ 
    $("img[title^=" + k).css("border","3px dotted " + fruit_color[k]) 
}