Вызов первой функции скрипта в последней для создания цикла
У меня есть скрипт, который при нажатии на кнопку удаляет стили, скрывающие несколько div и добавляет новую кнопку, которая при нажатии возвращает стили. Нужно сделать бесконечный цикл, который при нажатии на одну кнопку будет выполнять ее действие, удалять кнопку и добавлять другую. Сам скрипт написан, но проблема в том, что мне нужно вызвать первую функцию в последней, но выбивает ошибку Uncaught TypeError: Cannot read property 'remove' of null.
Скрипт:
Расширенный Фильтр
<script>
function deleteStyles() {
let myobj = document.getElementById("style-mobile");
myobj.remove();
let mybutton = document.getElementById("style-mobile-button");
mybutton.remove();
jQuery(document).ready(function($) {
//использование jQuery как $
$( ".stm-multiple-select" ).after( "<a onclick='addStyles()' id='style-mobile-button1' class='button stm-multiple-extend'><span>Убрать</span></a>" );
});
};
function addStyles(){
jQuery(document).ready(function show($) {
//использование jQuery как $
$( ".stm-multiple-select" ).after( "<a onclick='deleteStyles()' id='style-mobile-button' class='button stm-multiple-extend'><span>Розширений фільтр</span></a>" );
});
var status=document.getElementsByClassName('stm-filter_status');
for(var i=0; i<status.length; i++)status[i].style.display='none';
var ca_year=document.getElementsByClassName('stm-filter_ca-year');
for(var i=0; i<ca_year.length; i++)ca_year[i].style.display='none';
var fuel=document.getElementsByClassName('stm-filter_fuel');
for(var i=0; i<fuel.length; i++)fuel[i].style.display='none';
var body=document.getElementsByClassName('stm-filter_body');
for(var i=0; i<body.length; i++)body[i].style.display='none';
var transmission=document.getElementsByClassName('stm-filter_transmission');
for(var i=0; i<transmission.length; i++)transmission[i].style.display='none';
var price=document.getElementsByClassName('filter-price');
for(var i=0; i<price.length; i++)price[i].style.display='none';
var co2=document.getElementsByClassName('stm-filter_co2');
for(var i=0; i<co2.length; i++)co2[i].style.display='none';
var select=document.getElementsByClassName('stm-multiple-select');
for(var i=0; i<select.length; i++)select[i].style.display='none';
let mybutton1 = document.getElementById("style-mobile-button1");
mybutton1.remove();
};
</script>
Вызов первой функции должен быть после mybutton1.remove();
Ответы (1 шт):
Автор решения: Sasha Sasha
→ Ссылка
Рабочий скрипт:
<a onclick='deleteStyles()' id='style-mobile-button' class='button stm-multiple-
extend'>
<span>Расширенный Фильтр</span></a> <br>
<script>
function deleteStyles() {
let myobj = document.getElementById("style-mobile");
myobj.remove();
let mybutton = document.getElementById("style-mobile-button");
mybutton.remove();
jQuery(document).ready(function($) {
//использование jQuery как $
$( ".stm-multiple-select" ).after( "<a onclick='addStyles()' id='style-mobile-button1' class='button stm-multiple-extend'><span>Убрать</span></a>" );
});
};
function addStyles(){
jQuery(document).ready(function show($) {
//использование jQuery как $
$( ".stm-multiple-select" ).after( "<a onclick='deleteStyles()' id='style-mobile-button' class='button stm-multiple-extend'><span>Расширенный Фильтр</span></a>" );
});
$( ".sidebar-entry-header" ).after( "<style id='style-mobile'>@media (max-width: 426px){ .stm-filter_status{display:none} .stm-filter_ca-year{display:none} .stm-filter_fuel{display:none} .stm-filter_body{display:none} .stm-filter_transmission{display:none} .filter-price{display:none} .stm-filter_co2{display:none} .stm-multiple-select{display:none}} </style>" );
document.getElementById("style-mobile-button1").remove();
};
</script>