Как отменить предыдущее условие в if?

Question

[fron321]

Помогите решить такую проблему. Вообщем при клике на кнопу "ВЫБРАТЬ" я меняю цвет бордера у контейнера, добавляя класс selected. Потом проверяю, если этот класс присутствует меняю текст в p.text на новый. Как мне сделать, чтобы при втором нажатии на кнопу "ВЫБРАТЬ" (обратной смене цвета бордера), поменять текст на тот который был(на старый текст)??? в условии вместо return. Просто записывать старый текст не нужно.
https://codepen.io/fad90/pen/QWGQmgz

Answer 1

[Сергей Соколов]

я бы предложил разделить логику от представления. Хотя бы не опираться на наличие класса в принятии решений.

Оба варианта (А/Б) текста можно расположить в разметке:

<div class="container">

  <p class="text" data-text-a="ЭТО СТАРЫЙ ТЕКСТ" data-text-b="ВОТ НОВЫЙ ТЕКСТ"></p>

  <div class="btn">ВЫБРАТЬ</div>
</div>

Текущее состояние держать в объекте

const state = {
  isPrimary: true,
  // потом добавятся может ещё свойства
};

Отдельно функция render(), которая отрисовывает состояние «на сейчас».
По кнопке менять состояние и вызывать перерисовку.

Answer 2

[Василий Банников]

Наверное что-то типа

let textEl = document.querySelector(".text");
    let btnEl = document.querySelector(".btn");
    let containerEl = document.querySelector(".container");

    function changeBorder() {
      let selectEl = containerEl.classList.toggle("selected");
      
      if(containerEl.classList.contains("selected") ){
        textEl.innerHTML = "ВОТ НОВЫЙ ТЕКСТ";
      } else {
        textEl.innerHTML = "ЭТО СТАРЫЙ   ТЕКСТ";
      }
    };

    btnEl.addEventListener("click", changeBorder)

Comments

[fron321]

А можно, не записывая старый текст? Типо отменить предыдущее условие, например.

[Василий Банников]

fron321, Что значит "отменить предыдущее условие"?
Как вариант - сохраняй старые значения и откатывайся к ним, больше никак отменить нельзя