如何在标签中获得img src ?[英]How do I get the img src inside a tag? 本文翻译自  Paul  查看原文  2012-10-19  2694    javascript/

时间:2022-11-27 18:32:15

I'm trying to get the src of an image from a selected list item. The HTML looks like this:

我试图从选定的列表项中获取图像的src。HTML是这样的:

<li id="player_7">
  <div class="nailthumb-container square-thumb">
    <img src="../photos/files/7/thumb/6c0f1676cdcb1a9a5215db3e12572450.jpeg" />
  </div>
</li>

I can currently get the player ID from the selected list element like so:

我现在可以从选定的列表元素中获取播放器ID,如下所示:

jQuery

jQuery

$('#myDiv').find("li").click(function() {
    var user_id = $(this).attr('id').substr(7);
});

How can I get the img src from a selected list element?

如何从选定的列表元素中获得img src ?

3 个解决方案

#1


7  

If user_id corresponds to number in player ID, then try:

如果user_id对应于player ID中的number,则尝试:

var src = $("#player_" + user_id + " img").prop("src");

Otherwise, respectively to the clicked list item:

否则,分别对点击列表项:

$("#myDiv").find("li").click(function() {
    var src = $("img", this).prop("src");
});

#2


2  

Get image element using jQuery then read its src property.

使用jQuery获取图像元素,然后读取其src属性。

$('#myDiv').find("li").click(function() {
    var user_id = $(this).attr('id').substr(7);
   var src = $("img", this)[0].src;
});

#3


1  

May I ask why you're doing $("#myDiv").find("li") when "$("#myDiv li") should do just fine? Then, at that point, the following would suffice:

我可以问你为什么要做$(#myDiv).find(li)而$(#myDiv li)应该做得很好吗?那么,在这一点上,下列各点就足够了:

$('#myDiv li").click(function() {
    var user_id = $(this).attr('id').substr(7);
    var src = $("img",this).attr('src');
    // ...
});

Personally, I'd favor using a split on the ID to get the user_id, (.attr('id').split('_')[1]), but seeing as you'd have to modify your code either way if you needed to change your prefix or naming convention, I don't suppose that really matters much. It might affect performance (as split has always seemed to be faster, though I can't remember why), if you had a lot of these to parse at one time, but otherwise, for one-by-one operations, substr should work just fine.

就我个人而言,我倾向于在ID上使用split来获取user_id (.attr(' ID ').split('_')[1]),但是由于如果您需要更改前缀或命名约定,您必须以任何一种方式修改代码,所以我认为这并不是很重要。它可能会影响性能(因为split总是更快,尽管我不记得为什么),如果您一次要解析很多这样的操作,但是对于一个接一个的操作,substr应该可以正常工作。

#1


7  

If user_id corresponds to number in player ID, then try:

如果user_id对应于player ID中的number,则尝试:

var src = $("#player_" + user_id + " img").prop("src");

Otherwise, respectively to the clicked list item:

否则,分别对点击列表项:

$("#myDiv").find("li").click(function() {
    var src = $("img", this).prop("src");
});

#2


2  

Get image element using jQuery then read its src property.

使用jQuery获取图像元素,然后读取其src属性。

$('#myDiv').find("li").click(function() {
    var user_id = $(this).attr('id').substr(7);
   var src = $("img", this)[0].src;
});

#3


1  

May I ask why you're doing $("#myDiv").find("li") when "$("#myDiv li") should do just fine? Then, at that point, the following would suffice:

我可以问你为什么要做$(#myDiv).find(li)而$(#myDiv li)应该做得很好吗?那么,在这一点上,下列各点就足够了:

$('#myDiv li").click(function() {
    var user_id = $(this).attr('id').substr(7);
    var src = $("img",this).attr('src');
    // ...
});

Personally, I'd favor using a split on the ID to get the user_id, (.attr('id').split('_')[1]), but seeing as you'd have to modify your code either way if you needed to change your prefix or naming convention, I don't suppose that really matters much. It might affect performance (as split has always seemed to be faster, though I can't remember why), if you had a lot of these to parse at one time, but otherwise, for one-by-one operations, substr should work just fine.

就我个人而言,我倾向于在ID上使用split来获取user_id (.attr(' ID ').split('_')[1]),但是由于如果您需要更改前缀或命名约定,您必须以任何一种方式修改代码,所以我认为这并不是很重要。它可能会影响性能(因为split总是更快,尽管我不记得为什么),如果您一次要解析很多这样的操作,但是对于一个接一个的操作,substr应该可以正常工作。