Должно быть так. Нажимаем на красную кнопку >> появляется вторая кнопка >> нажимаем на вторую кнопку >> она становится красной.
let btn
let btn_pop
let body = document.querySelector("body")
let one = new Promise( function(resolve, reject){
btn=document.createElement("button")
btn.style.backgroundColor="red"
resolve()
})
one.then(function(){
let two = new Promise( function(resolve, reject){
body.append(btn)
btn.addEventListener(
"click", function(){btn_pop=document.createElement("button")
body.append(btn_pop)
})
resolve(btn_pop)})
}
).then(function(){
btn_pop.style.backgroundColor="red" }
)
Видимо, неправильно понимаю логику промисов. Как вижу я :
1) let one = new Promise создали кнопку и задаем ей красный цвет
2) one.then и вложенный в него let two = new Promise -поместили кнопку в body и задали ей обработчик событий. Пока событие клик не произойдет, код дальше обрабатываться не будет
3) нажимаем на кнопку, тем самым создавая новую кнопку, данные о ней передаем в resolve
4) и затем через следующий then задаем красный цвет новой кнопке.
Но по факту последний then срабатывает сразу же при нажатии на первую кнопку и ,естественно, не находит btn_pop.
Как это можно исправить и в чем ошибка?