In my attached code, I display a color picker, then I select a color, then I click the button "contact-info-btn" to change its background color to the selecetd color. However, the change is only good for that window. When refresh the window, it goes back to the old color. is there any way to make this change permanent?
<script>
document.querySelector('#contact-info-btn').addEventListener('click', (event) => {
event.target.style.backgroundColor = document.querySelector("#color-picker").value
});
<label for="color-picker">Color:</label>
<input type="color" id="color-picker" />
<form method="post" class="homepg-form" id="homepg-form" >
.
.
<button class="contact-info-btn" id="contact-info-btn" type="button" >İletişim bilgileri</button>
2
Answers
You can use
localStorage
to save the value and set it when the page reloads:localStorage:
localStorage is a property that allows JavaScript sites and apps to save key-value pairs in a web browser with no expiration date.