点击按钮通过JavaScript添加line-through样式不生效如何解决？

问题原因 #

你在closeIssue函数第29行为目标元素添加删除线样式后，立刻调用了fetchIssues()方法，该方法会清空issuesList容器的所有内容，再根据localStorage存储的数据重新渲染全部issue列表。你手动添加的行内样式会被新渲染的DOM直接覆盖，自然看不到生效效果。

解决方法 #

你不需要手动操作DOM加样式，只需要在渲染列表的时候根据issue的状态自动添加对应样式即可，同时还能保证页面刷新后已关闭的issue仍然会显示删除线：

1. 可以删除closeIssue函数里的第29行手动加样式的代码，这行代码已经没有实际作用
2. 修改fetchIssues方法中渲染描述标题的逻辑，判断如果当前issue状态为Closed就添加删除线样式：
   把原来的代码：

<h3 id="issue-${id}"> ${description} </h3>

修改为：

<h3 id="issue-${id}" style="${status === 'Closed' ? 'text-decoration: line-through' : ''}"> ${description} </h3>

修改完成后，只要你把issue状态改为Closed，重新渲染时会自动带上删除线样式，点击关闭按钮、刷新页面都能正常生效。

额外优化建议 #

你生成的id是字符串类型（Math.floor(Math.random() * 100000000) + ''末尾加了空字符串转字符串），但在绑定点击事件时传参没有加引号，会导致传入的参数是数字类型，虽然用==比较可以自动转换类型匹配成功，但如果后续改用严格相等===就会匹配不到对应issue，可以修改渲染时的事件绑定代码：

<a href="#" onclick="closeIssue('${id}')" class="btn btn-warning">Close</a>
<a href="#" onclick="deleteIssue('${id}')" class="btn btn-danger">Delete</a>

给${id}外层加上单引号，保证传入的参数是字符串类型，和存储的id类型一致。

内容的提问来源于stack exchange，提问作者Satyajit Roy