为什么在removeItem中不需要括号?为什么必须li.onclick = removeItem在newitem()函

Question

1. 为什么我不需要括号来removeItem？
2. 为什么li.onclick = removeItem在newitem((函数内？
3. 发生li.onclick事件时的逻辑序列是什么？newitem((执行吗？如果是这样，它是如何触发的？

我以为只有Enter键才会触发newitem((，并且由于li.onclick = removeItem在newitem((内，为什么要单击触发它？

免责声明：我在网上找到了此代码，但我不了解这些详细信息，希望你们能提供帮助。谢谢！

html

<input id="input" placeholder="What needs to be done?">
<ul id="list"></ul>

javascript

        function newItem() {
            var item = document.getElementById("input").value;
            var ul = document.getElementById("list");
            var li = document.createElement("li");
            if (document.getElementById("input").value != ""){
                li.appendChild(document.createTextNode(item));
                ul.appendChild(li);
                document.getElementById("input").value = "";                
            }
            li.onclick = removeItem;
        }

        document.body.onkeyup = function(e) {
          if (e.keyCode == 13) {
            newItem();
          }
        }
        function removeItem(e) {
            e.target.parentElement.removeChild(e.target);
        }

Answer 1

您不需要括号，因为您正在存储对该功能的引用。该函数将在以后调用。请参阅以下示例：

function f1() {
    console.log("f1 called");
}
var function_storage = f1;
function_storage();

li被声明为 newItem本地，因此只能在函数内使用。

发生onclick事件时，removeItem函数称为与上面示例中的f1相同的方式。

Answer 2

1. 我在树屋上找到了这种解释：

   没有括号的情况下，您实际上并未调用该功能。没有括号的功能名称是对函数的引用。

   我们不使用该代码中的括号，因为我们不希望在遇到该代码的点调用该函数。相反，我们希望将对函数的引用传递到.focus((方法中，只要元素接收焦点，该方法就会为我们调用我们的功能。

2. 它不需要。但是，将事件与您在JS中创建的元素联系起来的一种方法是将该事件绑在创建时与元素联系起来。现在，一旦插入到DOM中，每个元素现在都会有该事件。有时，这可能更明智。例如，您正在经历一个用于创建元素并将其插入DOM的循环。您无需在以后的时间再次循环以添加点击事件，而是可以在此处进行此操作以避免做更多的工作。

Answer 3

为什么我不需要括号来removeItem？

我认为您是指这条代码：

li.onclick = removeItem;

因为括号将 indoke 将其结果分配给 li.onclick。该函数不会返回任何内容，也没有结果，并且在不提供事件参数期望会导致错误的情况下调用它。

而不是调用函数，而是将对函数的引用分配为onclick对象的CC_7事件处理程序。在以后的时间，如果用户单击该元素，则 将调用函数。

为什么li.onclick = emoveItem在newitem((函数内？

好吧，因为那是li变量所在的地方。您可以随时随地分配一个onclick处理程序，但是要将其分配给特定对象，则需要在对该对象的引用的范围中。在该功能之外没有li变量，因此代码行是没有意义的。

发生li.onclick事件时的逻辑序列是什么？newitem((执行吗？如果是这样，它是如何触发的？

nope，removeItem()执行。浏览器为其提供了对单击事件的引用，该事件将在该功能内部的e变量中。这使您可以参考e.target查找单击的元素。

removeItem()是由于上述第一个问题中分配给li.onclick的引用。