Javascript - 查找IMG源並更改DIV背景

-1

我發現了很多不同情況的例子，但我只是沒有足夠的經驗來結合它們並完成我想要的結果。我正在嘗試創建一個TamperMonkey/GreaseMonkey腳本來突出顯示與特定圖像源匹配的DIV。Javascript - 查找IMG源並更改DIV背景

網站代碼如下，我不能改變它，但我刪除的圖像和多餘的代碼的URL所以它更容易閱讀：

<div class="listing_results> 
    <div class="listing_row" id="listing_1"> 
     <div class="listing_img_container">  
      <img id="listing_1_image" src="image-source-1.jpg"> 
     </div> 
    </div> 
    <div class="listing_row" id="listing_2"> 
     <div class="listing_img_container">  
      <img id="listing_2_image" src="image-source-2.jpg"> 
     </div> 
    </div> 
    <div class="listing_row" id="listing_3"> 
     <div class="listing_img_container">  
      <img id="listing_3_image" src="image-source-3.jpg"> 
     </div> 
    </div> 
</div>

進出口尋找代碼搜索圖像 - 來源 - ＃，並更改列表行 DIV當我找到它（例如，搜索image-source-2.jpg並將listing_row更改爲綠色）的背景顏色。

來源

2017-10-21 Ryan B

這是一個很簡單的，你在哪裏卡住了？一些有用的鏈接https://stackoverflow.com/questions/4191386/jquery-how-to-find-an-element-based-on-a-data-attribute-value https://stackoverflow.com/questions/ 3730035/how-to-change-css-using-jquery –

感謝您的鏈接，但很多答案/評論都超出了我的技能。我不一定會尋找任何使用最佳做法或最有效的方法。我嘗試過使用簡單的** if **，** else if **，** else **語句，但我不熟悉使用選擇器並根據結果操作HTML。 –

$('img[src="image-source-2.jpg"]').parent().css('background-color','red');

div{ 
 
    \t padding:5px; 
 
    }

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
 

 

 
<div class="listing_results> 
 
    <div class="listing_row" id="listing_1"> 
 
     <div class="listing_img_container"> 
 
      <img id="listing_1_image" src="image-source-1.jpg"> 
 
     </div> 
 
    </div> 
 
    <div class="listing_row" id="listing_2"> 
 
     <div class="listing_img_container"> 
 
      <img id="listing_2_image" src="image-source-2.jpg"> 
 
     </div> 
 
    </div> 
 
    <div class="listing_row" id="listing_3"> 
 
     <div class="listing_img_container"> 
 
      <img id="listing_3_image" src="image-source-3.jpg"> 
 
     </div> 
 
    </div> 
 
</div>

來源

2017-10-21 16:54:29 mscdeveloper

謝謝，這個效果很好。我也不得不添加'var $ = window.jQuery;'來使jQuery工作。原來我也有一個使用Javascript的工作版本，但因爲頁面花了這麼長時間才能加載，所以我的IF語句在任何條件成立之前都可以運行。 –

Javascript - 查找IMG源並更改DIV背景

回答

相關問題