使用jQuery获取图像src

Get image src using jQuery

本文关键字：src 图像 获取 jQuery 使用      更新时间：2023-09-26

我试图获得一个html图像的src属性。似乎我可以在DOM中找到img元素，但src属性未定义，有什么想法吗?

HTML: 

<table id="comboTable" style="width: 100%; height: 100%; margin-bottom: 10px;" data-bind="click: $root.selectCombo">
    <tr>
        <td>
            <img class="selector" src="~/Images/roundOffButton.png" style="position: absolute;margin-left: -57px; margin-top: -35px;" />
        </td>
        <td style="height: 35px;">
            <table style="width: 100%; background-color: #0097D8;padding:5px;">
                <tr style="padding:5px;">
                    <td style="height: 36px; padding-left: 14px; font-weight: bold;color: black; margin: 1px; width: 70%; text-align:left;">
                        <span data-bind="text: Description" style="padding-left: 5px;" />
                    </td>
                    <td style="width: 30%;padding:8px; text-align: center;color: white; background-color:black;">
                        <span data-bind="text: formatCurrency(Price)" style="font-size: 14px; white-space: nowrap;
                            font-weight: bold;" />
                    </td>
                </tr>
            </table>
        </td>
    </tr>
</table>
Javascript: 

var comboSpan = $("span:contains('" + description + "')");
var img = $(comboSpan).closest(".selector");
alert('Image object - ' + img);
var src = $(img).attr('src'); 
alert(src); //src is undefined

工作演示

  • 使用有效的img选择器，img和span有不同的父级，所以在这种情况下你不能直接使用closest()

  • 另外comboSpan,img已经是一个jQuery对象。你不需要像$(comboSpan)

  • 使用.closest('#comboTable')作为你的层次结构中有一个表

    <table>
     <tr>
         <td>
             <img>                      //You need this.
         </td>
         <td>
             <table>
                   <tr>
                         <td>
                              <span>    //You have this.
                         </td>
                   </tr>
             </table>
         </td>
     </tr>
</table>
最终代码:

var comboSpan = $("span:contains('" + description + "')");
var img = comboSpan.closest('#comboTable').find('.selector');    //Change this line
alert('Image object - ' + img);
var src = img.attr('src'); 
alert(src); //src is undefined

你需要找到最近的tr和.selector img:

var comboSpan = $("span:contains('" + description + "')");
var img = $(comboSpan).closest("tr").find(".selector");// find tr and then img
alert('Image object - ' + img);
var src = $(img).attr('src'); 
alert(src); //src is undefined

您首先尝试找到tr，然后它的子img(即.selector)

var img = $(comboSpan).closest('tr').find('.selector');

试试这个:

var comboSpan = $("span:contains('" + description + "')");
var img = $(comboSpan).closest('tr').find('.selector');
alert('Image object - ' + img);
var src = $(img).attr('src'); 
alert(src);

使用

var img = comboSpan.closest('tr').find('.selector');
// no need to wrap comboSpan with jquery as comboSpan is already a jquery object

看看这个。

$('.img1 img').attr('src');

只需如下所示:

var src = $('.selector').attr('src'); 
alert(src);

我的答案是爱

$('.img1 img').attr('src');
相关文章：