Javascript 如何使用jquery选择此div中的第一个图像?

Javascript 如何使用jquery选择此div中的第一个图像?,javascript,jquery,pseudo-element,Javascript,Jquery,Pseudo Element,我有一个div和一堆其他div和图像。主分区为m-carousel-inner。我想做的是选择这个div中的第一个img元素。我将如何在javascript或jquery中进行这项工作 <div class="m-carousel-inner"> <div class="m-item"> <div class="m-card-light"> <div class="mqc_img"> <img src="http://placehold.i

我有一个div和一堆其他div和图像。主分区为m-carousel-inner。我想做的是选择这个div中的第一个img元素。我将如何在javascript或jquery中进行这项工作

<div class="m-carousel-inner">

<div class="m-item">
<div class="m-card-light">
<div class="mqc_img">
<img src="http://placehold.it/280x210">
</div><!-- end .mqc_img -->
<div class="mqc_info">
<h5>Title</h5>
Lorem ipsum dolor sit amet
</div><!-- end .mqc_info -->
</div>
</div>

<div class="m-item">
<div class="m-card-light">
<div class="mqc_img">
<img src="http://placehold.it/280x210">
</div><!-- end .mqc_img -->
<div class="mqc_info">
<h5>Title</h5>
Lorem ipsum dolor sit amet
</div><!-- end .mqc_info -->
</div>
</div>

<div class="m-item">
<a href="#">
<div class="m-card-light">
<div class="mqc_img">
<img src="http://placehold.it/280x210">
</div><!-- end .mqc_img -->
<div class="mqc_info">
<h5>Title</h5>
Lorem ipsum dolor sit amet
</div><!-- end .mqc_info -->
</div>
</a>
</div>

<div class="m-item">
<div class="m-card-light">
<div class="mqc_img">
<img src="http://placehold.it/280x210">
</div><!-- end .mqc_img -->
<div class="mqc_info">
<h5>Title</h5>
Lorem ipsum dolor sit amet
</div><!-- end .mqc_info -->
</div>
</div>

<div class="m-item">
<div class="m-card-light">
<div class="mqc_img">
<img src="http://placehold.it/280x210">
</div><!-- end .mqc_img -->
<div class="mqc_info">
<h5>Title</h5>
Lorem ipsum dolor sit amet
</div><!-- end .mqc_info -->
</div>
</div>

<div class="m-item">
<div class="m-card-light">
<div class="mqc_img">
<img src="http://placehold.it/280x210">
</div><!-- end .mqc_img -->
<div class="mqc_info">
<h5>Title</h5>
Lorem ipsum dolor sit amet
</div><!-- end .mqc_info -->
</div>
</div>

<div class="m-item">
<div class="m-card-light">
<div class="mqc_img">
<img src="http://placehold.it/280x210">
</div><!-- end .mqc_img -->
<div class="mqc_info">
<h5>Title</h5>
Lorem ipsum dolor sit amet
</div><!-- end .mqc_info -->
</div>
</div>

<div class="m-item">
<div class="m-card-light">
<div class="mqc_img">
<img src="http://placehold.it/280x210">
</div><!-- end .mqc_img -->
<div class="mqc_info">
<h5>Title</h5>
Lorem ipsum dolor sit amet
</div><!-- end .mqc_info -->
</div>
</div>

<div class="m-item">
<div class="m-card-light">
<div class="mqc_img">
<img src="http://placehold.it/280x210">
</div><!-- end .mqc_img -->
<div class="mqc_info">
<h5>Title</h5>
Lorem ipsum dolor sit amet
</div><!-- end .mqc_info -->
</div>
</div>

<div class="m-item">
<div class="m-card-light">
<div class="mqc_img">
<img src="http://placehold.it/280x210">
</div><!-- end .mqc_img -->
<div class="mqc_info">
<h5>Title</h5>
Lorem ipsum dolor sit amet
</div><!-- end .mqc_info -->
</div>
</div>

<div class="m-item">
<div class="m-card-light">
<div class="mqc_img">
<img src="http://placehold.it/280x210">
</div><!-- end .mqc_img -->
<div class="mqc_info">
<h5>Title</h5>
Lorem ipsum dolor sit amet
</div><!-- end .mqc_info -->
</div>
</div>
</div><!-- end .m-carousel-inner -->

标题
Lorem ipsum dolor sit amet
标题
Lorem ipsum dolor sit amet
标题
Lorem ipsum dolor sit amet
标题
Lorem ipsum dolor sit amet
标题
Lorem ipsum dolor sit amet
标题
Lorem ipsum dolor sit amet
标题
Lorem ipsum dolor sit amet
标题
Lorem ipsum dolor sit amet
标题
Lorem ipsum dolor sit amet
标题
Lorem ipsum dolor sit amet
谢谢。

像这样吗

$('.m-carousel-inner').find('img:first');

请参见

第一部分
$('.m-carousel-inner')
是类
.m-carousel-inner
的容器元素的选择器,它将返回jquery包装的DOM元素,并应用
.find('img:First')
在任何级别查找img的第一个实例作为其子级。

在jquery中,您可以

<script>$('.m-carousel-inner img:first');</script>
$('.m-carousel-internalimg:first');

您还可以使用jQuery
first()
函数和jQuery选择器

<script> $('.m-carousel-inner img').first(); </script>
$('.m-carousel-internalimg').first();