Форум

ser1ko · #1 (**permalink**) 27.05.2021, 21:41

Есть код html и js

<div class="class1">
здесь текст
</div>

$('.class1').on('click',function () {
    $('.class1').removeClass('class1');
    $(this).addClass('class2')
    });

Сейчас по нажатию на class1 его classname заменяется на class2.

Как сделать так, чтобы затем при нажатии на любой элемент на странице, т.е. <body> class2 обратно менялся на class1 ? И чтобы так работало по кругу. Код js взял в интернете, доработать не смог(

рони · #2 (**permalink**) 27.05.2021, 22:06

ser1ko,

<!DOCTYPE html>
<html>
<head>
    <title>Untitled</title>
    <meta charset="utf-8">
    <style type="text/css">
        .class1 {
            color: #008000;
        }
        .class2 {
            color: #FF0000;
            font-size: 48px;
        }
    </style>
    <script>
        document.addEventListener('click', function({target}){
            if (target = target.closest('.class1')) {
                target.classList.remove('class1')
                target.classList.add('class2')
            } else if (target = document.querySelector('.class2')) {
                target.classList.remove('class2')
                target.classList.add('class1')
            }
            })
   </script>
</head>
<body>
    <div class="class1">
        здесь текст
    </div>
</body>
</html>

Форум

Справочник

Discord чат

Курсы javascript