如何获得$（this）选择器的子节点？

试试这个代码：

$(this).children()[0]

在不知道DIV的ID的情况下，我想你可以像这样选择IMG：

$("#"+$(this).attr("id")+" img:first")

您也可以使用

$(this).find('img');

这将返回div的后代的所有img

jQuery构造函数接受名为#0的第二个参数，该参数可用于覆盖选择的上下文。

jQuery("img", this);

这与使用#0相同，如下所示：

jQuery(this).find("img");

如果您想要的imgs是单击元素的只有直系后代，您也可以使用#0：

jQuery(this).children("img");

如果您的DIV标签紧跟IMG标签，您还可以使用：

$(this).next();

如果你需要得到第一个img，正好下降一个级别，你可以这样做

$(this).children("img:first")

直接的孩子们

$('> .child-class', this)

您可以像下面这样找到父div的所有img元素

$(this).find('img') or $(this).children('img')

如果你想要一个特定的img元素，你可以这样写

$(this).children('img:nth(n)')// where n is the child place in parent list start from 0 onwards

您的div只包含一个img元素。所以下面是正确的

 $(this).find("img").attr("alt")OR$(this).children("img").attr("alt")

但是如果你的div包含更多img元素，如下所示

<div class="mydiv"><img src="test.png" alt="3"><img src="test.png" alt="4"></div>

那么你就不能使用上层代码来查找第二个img元素的alt值。所以你可以试试这个：

 $(this).find("img:last-child").attr("alt")OR$(this).children("img:last-child").attr("alt")

此示例显示了如何在父对象中找到实际对象的一般想法。您可以使用类来区分您孩子的对象。这既简单又有趣。即

<div class="mydiv"><img class='first' src="test.png" alt="3"><img class='second' src="test.png" alt="4"></div>

你可以这样做如下：

 $(this).find(".first").attr("alt")

更具体的是：

 $(this).find("img.first").attr("alt")

您可以使用上述代码中的查找或子级。有关更多信息，请访问儿童http://api.jquery.com/children/和查找http://api.jquery.com/find/。示例http://jsfiddle.net/lalitjs/Nx8a6/

jQuery的each是一个选项：

<div id="test"><img src="testing.png"/><img src="testing1.png"/></div>
$('#test img').each(function(){console.log($(this).attr('src'));});

您可以使用儿童选择器引用父元素中可用的子元素。

$(' > img', this).attr("src");

下面是如果您没有对$(this)的引用，并且您想在其他函数的div中引用img。

 $('#divid > img').attr("src");

在jQuery中引用孩子的方法。我在以下jQuery中总结了它：

$(this).find("img"); // any img tag child or grandchild etc...$(this).children("img"); //any img tag child that is direct descendant$(this).find("img:first") //any img tag first child or first grandchild etc...$(this).children("img:first") //the first img tag  child that is direct descendant$(this).children("img:nth-child(1)") //the img is first direct descendant child$(this).next(); //the img is first direct descendant child

这也应该工作：

$("#id img")

您可以使用以下任何一种方法：

1查找（）：

$(this).find('img');

2个孩子（）：

$(this).children('img');

这是一个功能代码，你可以运行它（这是一个简单的演示）。

当您单击DIV时，您会从不同的方法获得图像，在这种情况下，“this”是DIV。

$(document).ready(function() {// When you click the DIV, you take it with "this"$('#my_div').click(function() {console.info('Initializing the tests..');console.log('Method #1: '+$(this).children('img'));console.log('Method #2: '+$(this).find('img'));// Here, i'm selecting the first ocorrence of <IMG>console.log('Method #3: '+$(this).find('img:eq(0)'));});});

.the_div{background-color: yellow;width: 100%;height: 200px;}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="my_div" class="the_div"><img src="..."></div>

希望有帮助！

您的<div>中可能有0到多个<img>标签。

要查找元素，请使用.find()。

为了保证代码的安全，请使用.each()。

同时使用.find()和.each()可以防止在0<img>元素的情况下出现空引用错误，同时还允许处理多个<img>元素。

// Set the click handler on your div$("body").off("click", "#mydiv").on("click", "#mydiv", function() {
// Find the image using.find() and .each()$(this).find("img").each(function() {  
var img = this;  // "this" is, now, scoped to the image element        
// Do something with the image$(this).animate({width: ($(this).width() > 100 ? 100 : $(this).width() + 100) + "px"}, 500);        
});  
});

#mydiv {text-align: center;vertical-align: middle;background-color: #000000;cursor: pointer;padding: 50px;  
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<div id="mydiv"><img src="" width="100" height="100"/></div>

你可以用

    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js">$(this).find('img');</script>

如果你的img是div中的第一个元素，那么尝试

$(this.firstChild);

$( "#box" ).click( function() {let img = $(this.firstChild);console.log({img});})

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id="box"><img src="https://picsum.photos/seed/picsum/300/150"></div>

使用原生javascript您可以使用

如果你有不止一个图像标签，那么使用

this.querySelectorAll("img")

如果只有一个图像标签那么我们

this.querySelector("img")