I wanted to know how this piece of code can be improved.
I don't know how well written it is to begin with.
How it can be written better.
Is there anything here you would write a different way?
code https://jsfiddle.net/7keLvajm/
.container2 {
display: none;
}
.container2.active {
display: flex;
}
.container1.active2 {
display: none;
}
function resetBackground(backgroundSelector) {
const background = document.querySelector(backgroundSelector);
background.classList.add("bg1");
}
function resetContainer1(containerSelector) {
const container = document.querySelector(containerSelector);
container.classList.add("active");
}
function resetContainer2(containerSelector2) {
const allContainers = document.querySelectorAll(containerSelector2);
function hideContainer(container1) {
container1.classList.add("active2");
}
allContainers.forEach(hideContainer);
}
function resetPage() {
resetBackground("body");
resetContainer1(".container2");
resetContainer2(".container1");
}
CodePudding user response:
Your code seems pretty good how it is, the only thing that I would want to draw attention to is your resetContainer2()
function:
function resetContainer2(containerSelector2) {
const allContainers = document.querySelectorAll(containerSelector2);
function hideContainer(container1) {
container1.classList.add("active2");
}
allContainers.forEach(hideContainer);
}
You are declaring a function inside of a function, which means it will only be able to be used inside resetContainer2()
. If you're okay with that, then your code seems good!