Page 316 - Web Applications (803) Class 12
P. 316
justify-content: space-between;
align-items: center;
padding: 10px 0;
border-bottom: 1px solid #ccc;
}
.delete-button {
background-color: #ff4b4b;
color: #fff;
border: none;
padding: 5px 10px;
border-radius: 5px;
cursor: pointer;
}
File3: Pscript.js
const taskInput = document.getElementById(‘task’);
const addTaskButton = document.getElementById(‘add-task’);
const taskList = document.getElementById(‘task-list’);
addTaskButton.addEventListener(‘click’, function () {
const taskText = taskInput.value.trim();
if (taskText !== ‘’) {
const listItem = document.createElement(‘li’);
listItem.innerHTML = `
${taskText}
<button class=”delete-button”>Delete</button>
`;
taskList.appendChild(listItem);
taskInput.value = ‘’;
const deleteButton = listItem.querySelector(‘.delete-button’);
deleteButton.addEventListener(‘click’, function () {
taskList.removeChild(listItem);
});
}
});
314 Touchpad Web Applications-XII

