附加孩子不会创建新的<p>当我点击我的按钮时标记

Question

我正在尝试创建一个简单的待办事项列表以练习部署它。 我已经创建了所有内容，但是当我单击应该添加项目的按钮时，它不会添加任何内容。 我相信问题出在附加孩子的 JS 代码行中。 有人看错了吗？

let addToDoButton = document.getElementById('addToDo');
let toDoContainer = document.getElementById('toDoContainer');
let inputField = document.getElementById('inputField');

addToDoButton.addEventListener('click', function(){
    var paragraph = document.createElement('p');
    paragraph.classList.add('paragraph-stlying');
    paragraph.innerText = inputField.value;
    toDoContainer.appendChild(paragraph);
    inputField.value = "";
    paragraph.addEventListener('click', function() {
        paragraph.style.textDecoration = "line-through";
    })
    paragraph.addEventListener('dblclick', function() {
        paragraph.removeChild();
    })
})

Answer 1

我查看了您的代码，它对我有用

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <meta name="theme-color" content="#000000" />
    <link rel="stylesheet" href="test.css">
    <title>Test App</title>
  </head>
  <body>
    <button id="addToDo">ADD Button</button>
    <div id="toDoContainer"></div>
    <input type="text" id="inputField">
    <script src="myscripts.js"></script>
  </body>
</html>

脚本

let addToDoButton = document.getElementById('addToDo');
let toDoContainer = document.getElementById('toDoContainer');
let inputField = document.getElementById('inputField');

addToDoButton.addEventListener('click', function(){
    var paragraph = document.createElement('p');
    paragraph.classList.add('paragraph-stlying');
    paragraph.innerText = inputField.value;
    toDoContainer.appendChild(paragraph);
    inputField.value = "";
    paragraph.addEventListener('click', function() {
        paragraph.style.textDecoration = "line-through";
    })
    paragraph.addEventListener('dblclick', function() {
        console.log('activated')
        paragraph.removeChild();

    })
})

附加孩子不会创建新的<p>当我点击我的按钮时标记

问题描述

1 个解决方案

解决方案1
-1 2022-07-16 23:05:27

附加孩子不会创建新的<p>当我点击我的按钮时标记

问题描述

1 个解决方案

解决方案1 -1 2022-07-16 23:05:27

解决方案1
-1 2022-07-16 23:05:27