javascript - 通过 JavaScript 编辑 CSS 会产生左侧赋值错误

Question

我正在尝试创建一个列表，当单击某个项目时，该项目将被删除(语法？)。但是，我收到以下错误:SyntaxError:左侧赋值无效。我是Web开发新手，所以不熟悉调试过程。

我最初通过传递一个会触发该项目的函数来构建我的代码，但这不起作用。作为引用，函数 getForm() 从输入框获取输入并将其附加到输入框下方显示的内容。

function getForm() {
.
.
.
/* Append the input to the list */
    var node = document.createElement("LI"); // Create a <li> node
    node.setAttribute("onclick", "strikethroughItem(this.id)"; // call func on click
    var textnode = document.createTextNode(task.name); // Create a text node
    node.appendChild(textnode);
    document.getElementById("list").appendChild(node); // Append <li> to <ul> with id="myList"
}
function strikethroughItem(id) {
    document.getElementById(id).style.text-decoration = "line-through";
}

为了看看这是否是一个有问题的方法，我将其调整为直接编辑，就像这样。

function getForm() {
/* Append the input to the list */
    var node = document.createElement("LI"); // Create a <li> node
    node.setAttribute("onclick", "document.getElementById(this.id).style.text-decoration = 'line-through'"); // call func on click
    var textnode = document.createTextNode(task.name); // Create a text node
    node.appendChild(textnode);
    document.getElementById("list").appendChild(node); // Append <li> to <ul> with id="myList" 
}

但是，它会产生相同的错误。

Answer 1

一般来说，JavaScript 中的函数和属性都是以驼峰命名法编写的。所以当你写

document.getElementById(id).style.text-decoration = "line-through"

JavaScript 将减号 (-) 视为左侧的奇怪减法和赋值，并且变得有点疯狂。

要解决此问题，请将其更改为使用正确的样式属性。

document.getElementById(id).style.textDecoration = "line-through"

您可以在 w3schools here 查看有关通过 JavaScript 进行样式设置的更多信息以及 CSS 和 JavaScript 属性之间的映射 here .