document.
addEventListener('DOMContentLoaded', loadTasks);
const taskInput = [Link]('task-input');
const addBtn = [Link]('add-btn');
const taskList = [Link]('task-list');
[Link]('click', addTask);
function addTask() {
const taskText = [Link]();
if (taskText === '') return;
const task = { text: taskText, completed: false, id: [Link]() };
saveTask(task);
renderTask(task);
[Link] = '';
}
function renderTask(task) {
const li = [Link]('li');
[Link] = 'task';
[Link] = [Link];
if ([Link]) [Link]('completed');
[Link] = `
<span>${[Link]}</span>
<div>
<input type="checkbox" ${[Link] ? 'checked' : ''}
onchange="toggleComplete(${[Link]})">
<button class="delete-btn"
onclick="deleteTask(${[Link]})">Delete</button>
</div>
`;
[Link](li);
}
function toggleComplete(id) {
const tasks = getTasks();
const task = [Link](t => [Link] == id);
[Link] = ![Link];
[Link]('tasks', [Link](tasks));
[Link](); // Simple reload to update UI
}
function deleteTask(id) {
const tasks = getTasks().filter(t => [Link] != id);
[Link]('tasks', [Link](tasks));
[Link]();
}
function loadTasks() {
const tasks = getTasks();
[Link](renderTask);
}
function getTasks() {
return [Link]([Link]('tasks')) || [];
}
function saveTask(task) {
const tasks = getTasks();
[Link](task);
[Link]('tasks', [Link](tasks));
}