Javascript MDL在表中添加复选框

我正在为自己开发一个待办应用程序，我想有一个检查系统。我在这个项目中使用MDL（material design light），但发现文档非常有限。我想向已将复选框设置为true/checked的列表中添加一个项目

我从其他人那里找到了这个函数的代码，但我并不真正理解它。有人能给我解释一下吗（我也在使用旧的JS版本，所以这个语法对我来说是全新的）。这是链接，我将第36行上完成的更改为true，得到了我想要的确切功能

我的HTML（我用JS添加到页面中）在没有选中复选框的情况下添加项目，如下所示

<tr>
 <td class="mdl-data-table__cell--non-numeric">Thing to do</td>
 <td><i class="material-icons md-18 delete">clear</i><i class="id">ID</i></td>
</tr>

要做的事
克利里德

---

如果我可以做一些轻微的调整，让MDL版本使用勾选的复选框工作，那将是令人惊讶的

我发现了问题所在，当我试着解决一些问题时，我打了个错字，当我试着解决一些问题时，我找到了解决办法。我应该插入的工作html如下所示：

<tr class="is-selected">
 <td class="mdl-data-table__cell--non-numeric">Thing to do</td>
 <td>
     <i class="material-icons md-18 delete">clear</i>
     <i class="id">ID</i>
 </td>

要做的事
清楚的
身份证件

---

谢谢大家的帮助

我不确定我是否理解您的问题，但是您提供的复选框代码笔不适用于添加的新任务，因为您正在添加的新任务没有被分配标识id所需的id，类似于

var task={id:Math.floor（Math.random（）*Number.MAX\u SAFE\u INTEGER），body:value，completed:false};尝试查看UUIDS我已经构建了自己的ID系统，该系统运行良好，唯一的问题是在加载以前保存的项目时将复选框插入复选框，该项目已选中=true（作为对象属性）。我只是用codepen来演示如何添加选中的复选框，但我并不真正理解代码，我只是在另一个stackoverflow页面上找到了它。你能为我解释一下身体：已完成：真/假吗？我真的不明白它实际上是如何勾选复选框的。复选框是根据
v-model
中设置的输入值来勾选的。因此，如果
v-model=“task.completed”
是真的，而不是真的，则通过将
v-model=“task.completed”
传递到复选框中来查看。谢谢，我从来都不知道vue.js（我自己的脚本只使用纯js，但它确实可以访问JQuery）。今天我学到了一些有价值的东西。现在我对代码笔的理解好多了！