javascript - 再次重新加载时删除 parentElement 并保存更改
问题描述
html代码
<div class="cont">
<div class="row">
<p>anything</p>
<input type="button" id="1" class="Done" name="Go" value="done">
</div>
<div class="row">
<p>anything</p>
<input type="button" id="2" class="Done" name="Go" value="done">
</div>
<div class="row">
<p>anything</p>
<input type="button" id="3" class="Done" name="Go" value="done">
</div>
</div>
我有 3 个[按钮]
javascript
var remove=document.getElementsByClassName("Done")
for(var i=0;i<remove.length;i++){
var button=remove[i]
button.addEventListener('click',function(event){
var bclick = event.target
bclick.parentElement.remove()
});
}
我试过了,这是第一次工作,但是当我重新加载时,我错过了更改。
解决方案
我认为您可以使用 localstorage 来跟踪您删除的 parentElement。只需检查您的本地存储是否删除了您的 parentElement,如果它已被删除,只需隐藏您的行类的元素。单击按钮后将不显示任何内容。希望它会有所帮助。
var remove = document.getElementsByClassName("Done");
for (var i = 0; i < remove.length; i++) {
var button = remove[i];
if (button) {
if (window.localStorage.getItem(remove[i].id) == 'true') {
document.getElementById(remove[i].id).parentNode.style.display = 'none';
}
}
}
for (var i = 0; i < remove.length; i++) {
var button = remove[i];
if (button) {
button.addEventListener('click', (event) => {
var bclick = event.target;
window.localStorage.setItem(bclick.id, 'true');
bclick.parentElement.remove();
});
}
}
推荐阅读
- owl - 定义一个实例属于某个类
- javascript - 如何阻止我的位置:固定 div 在光滑的滑块中移动?
- java - 为什么 intellij 代码自动完成功能不起作用?
- python - 为什么我的 LPvariable 类型在纸浆中不受尊重?
- sql-server - Azure 逻辑应用上的存储过程失败
- html - 更改html中标题的颜色
- video - 如何使用 ffmpeg 将 WebM 音频(Opus)和 MP4 视频(H.264)合并为一个 MP4 文件
- c# - C# 出站 HTTP 请求事件
- anypoint-studio - Mule 4 从 Cloudhub usinf 文件连接器上的 /tmp 目录写入和读取?
- angular - 传递给子组件时找不到异步管道