Javascript 错误：我的脚本中未定义deleteItem函数

我用javascript编写了一个待办事项列表，但这段代码不起作用，并显示了一个deleteItem（）未定义的错误。我在codepen中测试了它，它工作正常

window.onload = function () {
let ourForm = document.getElementById("ourform");
let ourField = document.getElementById("todo");
let ourList = document.getElementById("list");

ourForm.addEventListener("submit", e => {
    e.preventDefault();
    createItem(ourField.value);
});

function createItem(x) {
    let ourHtml = `<li>${x}<button onclick="deleteItem(this)">Delete</button></li>`;
    ourList.insertAdjacentHTML("beforeend", ourHtml);
    ourField.value = "";
    ourField.focus();
}

function deleteItem(elementToDelete) {
    elementToDelete.parentElement.remove();
}

window.onload=函数（）{
让ourForm=document.getElementById（“ourForm”）；
让ourField=document.getElementById（“todo”）；
让我们的列表=document.getElementById（“列表”）；
ourForm.addEventListener（“提交”，e=>{
e、 预防默认值（）；
createItem（ourField.value）；
});
函数createItem（x）{
让我们的HTML=`
${x}删除
`；
insertAdjacentHTML（“beforeend”，ourHtml）；
ourField.value=“”；
ourField.focus（）；
}
函数deleteItem（elementToDelete）{
elementToDelete.parentElement.remove（）；
}

}

NEED-TO-DO应用程序
创建项目
需要做

---

我的脚本有什么问题。

请尝试在

窗口外复制
deleteItem
函数。onload

函数，因为此时无法访问范围

  window.onload = function () {
    let ourForm = document.getElementById("ourform");
    let ourField = document.getElementById("todo");
    let ourList = document.getElementById("list");

    ourForm.addEventListener("submit", e => {
      e.preventDefault();
      createItem(ourField.value);
    });

    function createItem(x) {
      let ourHtml = `<li>${x}<button onclick="deleteItem(this)">Delete</button></li>`;
      ourList.insertAdjacentHTML("beforeend", ourHtml);
      ourField.value = "";
      ourField.focus();
    }

  }
  function deleteItem(elementToDelete) {
    elementToDelete.parentElement.remove();
  }

window.onload=函数（）{
让ourForm=document.getElementById（“ourForm”）；
让ourField=document.getElementById（“todo”）；
让我们的列表=document.getElementById（“列表”）；
ourForm.addEventListener（“提交”，e=>{
e、 预防默认值（）；
createItem（ourField.value）；
});
函数createItem（x）{
让我们的HTML=`
${x}删除
`；
insertAdjacentHTML（“beforeend”，ourHtml）；
ourField.value=“”；
ourField.focus（）；
}
}
函数deleteItem（elementToDelete）{
elementToDelete.parentElement.remove（）；
}

尝试在

窗口外复制
deleteItem
函数。onload

函数，因为此时无法访问范围

  window.onload = function () {
    let ourForm = document.getElementById("ourform");
    let ourField = document.getElementById("todo");
    let ourList = document.getElementById("list");

    ourForm.addEventListener("submit", e => {
      e.preventDefault();
      createItem(ourField.value);
    });

    function createItem(x) {
      let ourHtml = `<li>${x}<button onclick="deleteItem(this)">Delete</button></li>`;
      ourList.insertAdjacentHTML("beforeend", ourHtml);
      ourField.value = "";
      ourField.focus();
    }

  }
  function deleteItem(elementToDelete) {
    elementToDelete.parentElement.remove();
  }

window.onload=函数（）{
让ourForm=document.getElementById（“ourForm”）；
让ourField=document.getElementById（“todo”）；
让我们的列表=document.getElementById（“列表”）；
ourForm.addEventListener（“提交”，e=>{
e、 预防默认值（）；
createItem（ourField.value）；
});
函数createItem（x）{
让我们的HTML=`
${x}删除
`；
insertAdjacentHTML（“beforeend”，ourHtml）；
ourField.value=“”；
ourField.focus（）；
}
}
函数deleteItem（elementToDelete）{
elementToDelete.parentElement.remove（）；
}

尝试在加载时将这些createItem和deleteItem函数保持在窗口外尝试在加载时将这些createItem和deleteItem函数保持在窗口外