チェックボックスがfalseされない問題を解決したい。

Question

クリックした時のチェックの有無でtrueかfalseを返したい。

チェックボックスにチェックが付いているときにtrue、
チェックボックスにチェックが付いていないときはfalseが返ってくる処理を実装する。

発生している問題・エラーメッセージ

} else if (element.nodeName.checked = false) {
  element.setAttribute('id', 'false');
}

//　上記のコードが反映されない為、falseが反映されない。

該当のソースコード

  <div class="todo">
                <h2 class="heading-2 todo__title">To Do List</h2>
                <form action="" class="todo__form" id="todoForm">
                    <input class="todo__input" type="text" id="todoInput">
                    <button class="todo__button" id="todoButton">add</button>
                </form>
                <ul class="todo__list" id="todoList">
                    <!-- <li class="todo__item">
                        <svg class="todo__icon">
                            <use xlink:href="img/sprite.svg#icon-cross"></use>
                        </svg>
                    </li>
                    <li class="todo__item">
                        <svg class="todo__icon">
                            <use xlink:href="img/sprite.svg#icon-cross"></use>
                        </svg>
                    </li> -->
                    <!-- <li class="todo__item">
                        <svg class="todo__icon">
                            <use xlink:href="img/sprite.svg#icon-cross"></use>
                        </svg>
                    </li>
                    <li class="todo__item">
                        <svg class="todo__icon">
                            <use xlink:href="img/sprite.svg#icon-cross"></use>
                        </svg>
                    </li>
                    <li class="todo__item">
                        <svg class="todo__icon">
                            <use xlink:href="img/sprite.svg#icon-cross"></use>
                        </svg>
                    </li> -->
                </ul>
            </div>

let todoList = [];

const todoForm = document.getElementById('todoForm');
todoForm.addEventListener('submit', event => {
    event.preventDefault();
})

const todoButton = document.getElementById('todoButton');
todoButton.addEventListener('click', () => {
    const input = document.getElementById('todoInput');
    const text = input.value.trim();
    if (text !== '') {
        addTodo(text);
        input.value = ''
        input.focus();
    }
})

function addTodo(text) {
    const todo = {
        text,
        checked: false,
        id: Date.now()
    };
    todoList.push(todo);
    console.log(todoList);
    renderTodo(todo);
}

function renderTodo(todo) {
    let list = document.getElementById('todoList');
    let li = document.createElement('li');
    li.setAttribute('class', 'todo__item');
    li.setAttribute('id', todo.id);
    li.innerHTML += `
    <input class="todo__item-input" type="checkbox" id=${todo.checked}>
    ${todo.text}
    <svg class="todo__icon">
    <use xlink:href="img/sprite.svg#icon-cross"></use>
    </svg>
    `;


    const children = li.children;
    Array.from(children).forEach(function (element) {
        element.addEventListener('click', () => {
            if (element.nodeName.checked = true) {
                element.setAttribute('id', 'true');
            } else if (element.nodeName.checked = false) {
                element.setAttribute('id', 'false');
            }
            // if (element.nodeName == 'INPUT') {
            //     element.setAttribute('id', 'true');
            //     element.setAttribute('id', 'false');
            // } else if (element.nodeName == 'svg') {
            //     alert('svg');
            // }
        })
    });

    list.appendChild(li);
}

参考にしたサイト

Check/Uncheck checkbox with JavaScript

Answer 1

} else if (element.nodeName.checked = false) {

条件式なのに代入しているからではないでしょうか

Answer 2

if (element.nodeName.checked = true) {
} else if (element.nodeName.checked = false) {
2箇所とも判定が代入になっています(=でなく== or ===)
また、おそらくチェックの判定はelement.checked === true で良いと思います。（nodeNameはいらない）