JQuery/Javascript圖像替換

我正試圖做一個非常簡單的圖像替換Twitter小部件徽標到我指定的徽標。我怎麼能做到這一點，請注意，twitter徽標上沒有ID或類，所以我不確定我如何做替換，它可能必須遍歷每個圖像，然後只替換那個火柴。JQuery/Javascript圖像替換

例..

<script src="http://widgets.twimg.com/j/2/widget.js"></script> 
<script> 
new TWTR.Widget({ 
    version: 2, 
    type: 'profile', 
    rpp: 4, 
    interval: 6000, 
    width: 250, 
    height: 300, 
    theme: { 
    shell: { 
     background: '#333333', 
     color: '#ffffff' 
    }, 
    tweets: { 
     background: '#000000', 
     color: '#ffffff', 
     links: '#4aed05' 
    } 
    }, 
    features: { 
    scrollbar: false, 
    loop: false, 
    live: false, 
    hashtags: true, 
    timestamp: true, 
    avatars: false, 
    behavior: 'all' 
    } 
}).render().setUser('twitter').start(); 
</script>

以上是我使用Twitter的代碼，這使得Twitter的標識和網址爲http://widgets.twimg.com/i/widget-logo.png，我需要這種改變/image/twitter.jpg。

來源

2011-08-25 techco1

你能給我們一個鏈接，這個小部件實際使用的位置？否則，我會嘗試查看螢火蟲（或任何devtool），看看圖像是否有風格，因爲這將是您可以使用的jQuery選擇器。然後通過設置（'img'）。attr（'src'，'/ image/twitter.jpg'）來改變src屬性，它應該沒問題。如果沒有樣式，請嘗試通過標記來查找映射圖像的方法，也許還可以使用.eq（）或這樣的jquery函數。但是我可以給你一個詳細的答案，如果我能看到這個小工具在某個地方工作。 – GNi33

你爲什麼想這樣做？你是否證實你被允許？ –

http://twitter.com/about/resources/widgets/widget_profile這是使用小部件的地方。 – techco1

你可以使用一個屬性測試（因爲它是元素的具體信息），如果嚴格相等：

var logoTwitter = $('img[src="http://widgets.twimg.com/i/widget-logo.png"]');

如果圖片的URL是不太一致（意思是，也許部分是可變的）你可以測試目的：

var logoTwitter = $('img[src$="/widget-logo.png"]');

檢查這些選擇：http://api.jquery.com/category/selectors/

來源

2011-08-25 10:47:45 dmidz

使用jQuery：找到具有源屬性設置爲th圖像e twitter徽標，並將src屬性替換爲您的圖片的相對url：

$("img[src='http://widgets.twimg.com/i/widget-logo.png']").attr("src","/image/twitter.jpg");

來源

2011-08-25 10:48:39

哇，剛剛學到了一些東西。謝謝！不知道你可以直接在選擇器中使用src-attribute。 – GNi33

你可以但它會很慢。爲什麼不選擇放置Twitter按鈕的容器 - 給它一個ID - 然後在該容器內查找唯一的'img'。 –

我得到一個錯誤！未捕獲的語法錯誤，無法識別的表達式：src ='http：//widgets.twimg.com/i/widget-logo.png'） – techco1

一種選擇是使用選擇器來定位帶有徽標的屬性。這可以使用選擇器$('div.twtr-ft a[href="http://twitter.com"] img')來定位標記，然後使用attr函數替換src屬性。

我的問題與上述是對小部件的更改可能會打破您的代碼。我選擇使用選擇器的主頁，因爲它不太可能改變比圖像的位置。 div.twtr-ft是可選的，但有助於防止對包含帶圖片的錨點的小部件進行任何添加以破壞代碼。

來源

2011-08-25 10:52:13

JQuery/Javascript圖像替換

回答

相關問題