我想随机点击我的列表项但不能

【问题标题】：I want to click my list item in random but can't我想随机点击我的列表项但不能
【发布时间】：2018-10-29 19:53:57
【问题描述】：

我想在我的项目列表中添加一个点击事件。这是一个 TO-DO-LIST，所以每当我单击列表项时，它都应该具有直通样式。但是，我无法正确处理。控制台总是说：

Uncaught TypeError: togList.addEventListener is not a function

var togList = document.getElementsByTagName("li");

function togglesOnOff() {
        togList.classList.toggle("done");
}

togList.addEventListener("click", togglesOnOff);

【问题讨论】：

要检查的一点是脚本可能在处理 HTML 元素之前正在运行。
哦..我确定脚本在最后一部分。谢谢。

标签： javascript list click html-lists addeventlistener

【解决方案1】：

您收到错误是因为 getElementsByTagName 没有返回元素，而是返回了 collection of elements。

所以，你需要遍历集合：

var togList = document.getElementsByTagName("li");

function togglesOnOff() {
  this.classList.toggle("done");
}

Array.from(togList).forEach(item => item.addEventListener("click", togglesOnOff));

.done {
  background: red;
}

<ul>
  <li>Item one</li>
  <li>Item two</li>
  <li>Item three</li>
</ul>

您还需要更改函数以使用当前元素来切换类。为此，我们只需将togList 更改为this。

【讨论】：

感谢您的快速答复。我只是想补充一点。该代码仅适用于原始列表项，每当我通过文本框添加项目时，切换功能将不适用于它们。
您需要在创建它们时将事件添加到它们。