Javascript购物清单声明让答案

【问题标题】：Javascript Shopping list declaring letJavascript购物清单声明让
【发布时间】：2020-08-06 13:37:08
【问题描述】：

当我尝试像其他 let 一样全局声明 let inputError 或者我在函数中的 inputError 之前编写 let 时，为什么这个程序不起作用？我不明白为什么它只在没有 let, const 的函数内部声明时才有效。

let ul_var; 
let shoppingArray = ["Mleko", "Jajka", "Piwo"]; 
let new_item_form_var;

>>>> let inputError; <<<< //without it works

document.addEventListener("DOMContentLoaded", () => {
  ul_var = document.getElementById("shopping");
  >>>> let <<<< inputError = document.getElementById('inputError');
  new_item_form_var = document.getElementById("new_item_form");


  new_item_form_var.addEventListener("submit", (event) => {
    event.preventDefault();
    let input = event.target.elements[0];

    if (input.value.length > 2 && !input.value.startsWith(' ')) {
      addListItem(input.value);
      input.value = '';
      input.classList.remove('input-danger');
      inputError.innerText = ''; 
    } else {
      inputError.innerText = 'Nazwa nie spelnia kryteriow';
      input.classList.add('input-danger') 
    }
  });

  for (let x of shoppingArray) {
    addListItem(x);
  }

});

function addListItem(y) {
  let li_var = document.createElement("li"); 
  li_var.innerText = y; 
  ul_var.appendChild(li_var);
}

【问题讨论】：

控制台有错误信息吗？
这能回答你的问题吗？ Reassigning a variable using 'let' is not working
阅读上面的建议，你基本上回答了你自己的问题。

标签： javascript let

【解决方案1】：

如果你有一个let inputError，那么你不能有另一个，因为你不能声明同一个变量多次。你应该写：

let inputError;

document.addEventListener("DOMContentLoaded", () => {
  ul_var = document.getElementById("shopping");
  inputError = document.getElementById('inputError'); // no let

或者这个，如果你不在事件监听器之外使用inputError：

// no 'let inputError;'

document.addEventListener("DOMContentLoaded", () => {
  ul_var = document.getElementById("shopping");
  let inputError = document.getElementById('inputError');

【讨论】：