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

Question

我找到了许多不同情况的例子，但我只是没有足够的经验来结合它们并实现我想要的结果。 我正在尝试创建一个TamperMonkey/GreaseMonkey脚本来突出显示与特定图像源匹配的 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>

我正在寻找代码来搜索image-source-# ，并在找到它时更改列表行DIV 的背景颜色（例如，搜索 image-source-2.jpg 并将列表行更改为绿色）。

Answer 1

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

 div{ 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>