Показать сообщение отдельно
  #16 (permalink)  
Старый 10.09.2021, 20:16
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,109

Alexander3928,
<!DOCTYPE html>
<html>

<head>
    <title>Untitled</title>
    <meta charset="utf-8">
    <style type="text/css">
    </style>
    <script>
        document.addEventListener("DOMContentLoaded", function() {
            const arr_url = [
                ["https://picsum.photos/300/100?4"],
                ["https://picsum.photos/300/100?5"],
                ["https://picsum.photos/300/100?6"]
            ];
            const main_box = document.querySelectorAll(".main-box");
            main_box.forEach(box => box.addEventListener("click", urlImage));

            function urlImage(e) {
                let button = e.target.closest(".button");
                if (button) this.querySelectorAll(".image").forEach((img, i) => img.src = arr_url[i]);
            };
        });
    </script>
</head>

<body>
    <div class="main-box">
        <div class="box">
            <button class="button">GO-1</button>
        </div>
        <div class="box">
            <img src="https://picsum.photos/300/100?1" class="image">
            <img src="https://picsum.photos/300/100?2" class="image">
            <img src="https://picsum.photos/300/100?3" class="image">
        </div>
    </div>
</body>

</html>

Последний раз редактировалось рони, 10.09.2021 в 20:22.
Ответить с цитированием