JavaScript从给定的交换机获取值并将其在线写入某个文件



完整代码如下所示。我想获得开关的值,并将其写入在线的一些。txt文件中,每次当我打开这个网页时,它应该从在线的。txt文件中获取值,并相应地更新开关。有办法吗?

我是JavaScript的新手,我所有的经验都是在Python编程。因此,我是从python的角度来问这个问题的(python文件,Web抓取等)

JavaScript是否能够在线从文件中获取数据并同步更新?

.switch {
position: relative;
display: inline-block;
width: 60px;
height: 34px;
}
.switch input {
opacity: 0;
width: 0;
height: 0;
}
.slider {
position: absolute;
cursor: pointer;
top: 0;
left: 0;
right: 0;
bottom: 0;
background-color: #ccc;
-webkit-transition: .4s;
transition: .4s;
}
.slider:before {
position: absolute;
content: "";
height: 26px;
width: 26px;
left: 4px;
bottom: 4px;
background-color: white;
-webkit-transition: .4s;
transition: .4s;
}
input:checked+.slider {
background-color: #2196F3;
}
input:focus+.slider {
box-shadow: 0 0 1px #2196F3;
}
input:checked+.slider:before {
-webkit-transform: translateX(26px);
-ms-transform: translateX(26px);
transform: translateX(26px);
}

/* Rounded sliders */
.slider.round {
border-radius: 34px;
}
.slider.round:before {
border-radius: 50%;
}
<h2>Dark and Day Mode</h2>
<label class="switch">
<input type="checkbox" checked />
<span class="slider round"></span>
</label>

JS部分如下:

let isChecked = document.querySelector("#switch");
isChecked.addEventListener('click', function() {
console.log(isChecked.checked)
})
.switch {
position: relative;
display: inline-block;
width: 60px;
height: 34px;
}
.switch input {
opacity: 0;
width: 0;
height: 0;
}
.slider {
position: absolute;
cursor: pointer;
top: 0;
left: 0;
right: 0;
bottom: 0;
background-color: #ccc;
-webkit-transition: .4s;
transition: .4s;
}
.slider:before {
position: absolute;
content: "";
height: 26px;
width: 26px;
left: 4px;
bottom: 4px;
background-color: white;
-webkit-transition: .4s;
transition: .4s;
}
input:checked+.slider {
background-color: #2196F3;
}
input:focus+.slider {
box-shadow: 0 0 1px #2196F3;
}
input:checked+.slider:before {
-webkit-transform: translateX(26px);
-ms-transform: translateX(26px);
transform: translateX(26px);
}

/* Rounded sliders */
.slider.round {
border-radius: 34px;
}
.slider.round:before {
border-radius: 50%;
}
<h2>Dark and Day Mode</h2>
<label class="switch">
<input id="switch" type="checkbox" checked  />
<span class="slider round"></span>
</label>

最新更新