El código completo se muestra a continuación. Me gustaría obtener el valor de Switch y escribirlo en algún archivo .txt en línea y cada vez que abro esta página web, debería obtener el valor de ese archivo .txt en línea y actualizar el interruptor en consecuencia. ¿Hay alguna forma de hazlo
Soy un novato en JavaScript y toda mi experiencia es en la programación de Python. Por lo tanto, hago esta pregunta desde una perspectiva de Python (archivos de Python, Web Scraping, etc.)
¿Es JavaScript lo suficientemente capaz de obtener algunos datos de un archivo en línea y actualizarlos de forma síncrona?
.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>Me gusta esto para la parte 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>