Вы можете использовать метод find() для получения дочерних элементов селектора $(this) с помощью jQuery.

Код jQuery в следующем примере просто выберет дочерний элемент <img> и применит к нему некоторые CSS-стили при щелчке родительского элемента <div>.

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>jQuery Select the Child Element Inside a DIV On Click</title>
<style>
    .box{
        padding: 80px;
        border: 10px solid #999;
        text-align: center;
    }  
    .box img{
        width: 400px;
        border: 6px solid #999;
    }
</style>
<script src="https://code.jquery.com/jquery-3.5.1.min.js"></script>
<script>
$(document).ready(function(){
    $(".box").click(function(){
        $(this).find("img").css("border-color", "blue");
    });
});
</script>
</head>
<body>
    <div class="box">
        <img src="images/sky.jpg" alt="Cloudy Sky">
    </div>
</body>
</html>

Если вы хотите получить только прямых потомков целевого элемента, вы также можете использовать метод children(). Метод children() перемещается только на один уровень вниз по дереву DOM, тогда как find() может перемещаться вниз на несколько уровней для выбора дочерних элементов (внуков и т. д.).

Читайте также

Насколько публикация полезна?

Нажмите на звезду, чтобы оценить!

Средняя оценка 5 / 5. Количество оценок: 1

Оценок пока нет. Поставьте оценку первым.