我正在尝试在Javascript中创建一个基本的待办事项列表。我基本上没有这种语言的经验，所以我试图尽可能保持基本。我希望在用户点击它时更改列表项的外观（例如，在文本中有一个行标记）。我一直在使用其他一些JavaScript的源代码，但由于某种原因它不能使用我的代码。
这是问题点。
<script>
var list = document.querySelector('ul');
list.addEventListener('click', function(ev) {
if (ev.target.tagName === 'LI') {
ev.target.classList.toggle('checked');
}
}, false);
</script>
<html>
<ul id = "toDoList">
<li id = "checked">Do laundry</li>
<li>Wash car</li>
</ul>
</html>
CSS：
.checked {
text-decoration: line-through;
}
如果有人能帮助我解决这个问题，那就太棒了！ （同样，从JQuery中明确指出，我对此一无所知。）
您必须在加载元素后运行javascript代码，否则您将无法找到它并且代码将无法运行。
.checked {
text-decoration: line-through;
}<html>
<ul id = "toDoList">
<li id = "checked">Do laundry</li>
<li>Wash car</li>
</ul>
<script>
var list = document.querySelector('ul');
list.addEventListener('click', function(ev) {
if (ev.target.tagName === 'LI') {
ev.target.classList.toggle('checked');
}
}, false);
</script>
</html>另一种可能性是仍然将代码置于顶部但是使其在页面加载window.onload之后运行 - 您分配的函数将在页面加载后运行。
.checked {
text-decoration: line-through;
}<html>
<script>
window.onload = function(){
var list = document.querySelector('ul');
list.addEventListener('click', function(ev) {
if (ev.target.tagName === 'LI') {
ev.target.classList.toggle('checked');
}
}, false);
}
</script>
<ul id = "toDoList">
<li id = "checked">Do laundry</li>
<li>Wash car</li>
</ul>
</html>这是一个解决您的问题的代码。 但是，如果你想用JavaScript编写代码，我认为你应该学习JavaScript。 JS语言与其他类C语言（C，C ++，Java等）具有相似的语法，但是它的底层却非常不同。
代码：
<html>
<body>
<style>
.checked {
text-decoration: line-through;
}
</style>
<ul>
<li class="item">task 1</li>
<li class="item">task 2</li>
</ul>
<script>
(function()
{
var items = Array.from(document.getElementsByClassName("item"));
items.forEach(function(item)
{
item.onclick = function()
{
item.className += " checked";
}
});
})();
</script>
</body>
<html>