javascript - 获取li里面的图片url

Question

我有这个代码

<li>
    <div class="product-container">
        <div class="product-imgs">
            <img src="https://xxxx.png">
        </div>
        <div class="product-desc product-desc-top">
            <h3>Kitten 1</h3>
            <p class="title-desc">This is kitten kitten kitten kitten kitten kitten</p>
        </div>
        <div class="product-desc product-desc-bottom">
            <h4>$ 999</h4>
            <p class="count-buyers">1 buyer</p>
        </div>
    </div>
</li>

我有很多<li>，我想要的条件是这样的：

如果我点击<li>我想获取 img url。我也想获得 h3, p, h4, p 内容。

是否可以使用 jQuery 处理这种情况？

谢谢

Answer 1

试试看：

// 获取图片 url 和标签克隆。

 $(function() {
           $("li").click(function(){
                var imgUrl = $(this).find("img").attr("src");
                var h3 = $(this).find("h3").clone();
                var h4 = $(this).find("h4").clone();
                var title_desc = $(this).find(".title-desc").clone();
                var count_buyers = $(this).find(".count-buyers").clone();
            })
        });

// 获取图像 url 和标签上的文本。

$(function() {
           $("li").click(function(){
                var imgUrl = $(this).find("img").attr("src");
                var h3 = $(this).find("h3").text();
                var h4 = $(this).find("h4").text();
                var title_desc = $(this).find(".title-desc").text();
                var count_buyers = $(this).find(".count-buyers").text();
            })
        });

Answer 2

你可以这样做

    $('li').click(function()
    {
    var img = $(this).find('img');
var url = $(img).attr('src');        
var h3 = $(this).find('h3').html();
    });

工作jsfiddle：http: //jsfiddle.net/WZL7J/1/

Answer 3

尝试这个：

$('li div:first-child div img').attr('src');

var value = $('li div:nth-child(2) div h3').html();

var value2 = $('li div:nth-child(2) div h4').html();

等等。