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>

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

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>

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

1 个答案: