Всем привет! Написал тут решение данной задачи, но мне кажется что это какой-то костыль. Если есть идеи, накидайте, пожалуйста. Дайте аргументы если где-то что-то коряво и или даже если нормально :). Вот сама задача и мое решение:
Дан абзац. Даны чекбоксы 'перечеркнуть', 'сделать жирным', 'сделать красным'. Если соответствующий чекбокс отмечен - заданное действие происходит с абзацем (становится красным, например). Если чекбоксу снять отметку - действие отменяется.
let p = document.querySelector('p');
let checkbox = document.querySelectorAll('input');
for (let i = 0; i < checkbox.length; i++) {
if (i === 0) {
checkbox[i].addEventListener('click', changeTextDecoration);
}
if (i === 1) {
checkbox[i].addEventListener('click', changeFontWeight);
}
if (i === 2) {
checkbox[i].addEventListener('click', changeColor);
}
}
function changeTextDecoration() {
if (this.checked) {
p.style.textDecoration = 'line-through';
} else {
p.style.textDecoration = 'none';
}
}
function changeFontWeight() {
if (this.checked) {
p.style.fontWeight = 'bold';
} else {
p.style.fontWeight = 'normal';
}
}
function changeColor() {
if (this.checked) {
p.style.color = 'red';
} else {
p.style.color = 'black';
}
}
<p> Paragraph </p>
<input type="checkbox"> Перечеркнуть
<input type="checkbox"> Сделать полужирным
<input type="checkbox"> Сделать красным