Здравствуйте! Пишу userscript для ВКонтакте.
Условие его работы: к примеру, у нас есть страница, с которой нужно скрыть или удалить элемент, для этого я использую checkbox и Local Storage для записи изменений. Заходим на страницу, где нужно скрыть элемент, ставим галочку на чекбос и элемент скрывается. Но если в этой же вкладке открыть другую страницу, а потом вернуться на ту страницу, где скрыли элемент, то он будет не скрытым, а видимым. При этом галочка будет оставаться в чекбосе (потому что изменения сохранены в LStorage, как и изменения скрытия\показа элемента). Как исправить, друзья? На чистом JS, без использования библиотек.
Листинг скрипта:
var page_cover = document.getElementsByName('.top_home_logo');
var logo = document.createElement('div');
var side_bar_inner = document.getElementById('side_bar_inner');
logo.innerHTML = '<a id="toggler" href="#">Script</a><div id="box" style="display: none;"><input type="checkbox" id="rem">Удалить логотип</div>';
logo.style = 'width: 150px';
side_bar_inner.appendChild(logo);
window.onload= function() {
document.getElementById('toggler').onclick = function() {
openbox('box', this);
return false;
};
};
function openbox(id, toggler) {
var div = document.getElementById(id);
if(div.style.display == 'block') {
div.style.display = 'none';
toggler.innerHTML = 'Script';
}
else {
div.style.display = 'block';
toggler.innerHTML = 'Script';
}
}
document.getElementById('rem').onclick = function() {
if(document.getElementById('rem').checked) {
localStorage.setItem('rem', "true");
document.querySelector(".top_home_logo").style.display= "none";
localStorage.setItem('text', "true");
} else {
localStorage.removeItem('rem', "false");
document.querySelector(".top_home_logo").style.display = "";
localStorage.removeItem('text');
}
};
if (localStorage.getItem('rem') == "true") {
document.getElementById("rem").setAttribute('checked','checked');
document.querySelector(".top_home_logo").style.display = "none";
}