Problem z .remove

0

Cześć,

chcę usunąć div na urządzeniu mobilnym, ale coś nie działa.


<script>
if ($(window).width() < 768) { 
 $( "div" ) .remove( ".doukrycia" );
}
</script>
 <div class="doukrycia">
do ukrycia
 </div>

w head mam

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>

Niby wszystko jest proste, ale nie ogarniam tego, nie chce działać

2
  1. Otwórz konsole i sprawdź czy nie wyświetla się błąd.
  2. Poczytaj o media queries w CSS, ukrywania elementów w zależności od szerokości ekranu zazwyczaj nie robi się w JS.
0

W konsoli nie ma błędów.

Nie chcę ukrywać tego za pomocą css, ponieważ ten div ma zbyt dużo kodu i mocno zaniża mi to wydajność w pagespeed.
Chcę całkowicie wyeliminować tego diva z kodu strony

2

Jako że ten div masz zadeklarowany poniżej swojego kodu, jest on niedostępny (niewidoczny) w momencie gdy uruchamiany jest Twój kod JS; możesz albo przenieść <script> niżej, albo wykorzystać $(document).ready().

ponieważ ten div ma zbyt dużo kodu i mocno zaniża mi to wydajność w pagespeed.

To brzmi niezwykle podejrzanie - w jaki sposób div może obniżać wydajność i, przede wszystkim, w jaki sposób ukrywanie go za pomocą JSa ma być tą lepszą opcją?

0

Zrobiłem coś takiego jak radziłaś i zadziałało. Dzięki

<script >
$(document).ready(() => {
if ($(window).width() < 768) { 
 $( "#deskopowyslider" ) .remove();
}
});
</script>

Na stronie użyłem skomplikowanego slidera, który ma mnóstwo kodu. Slider jest wyświetlany tylko na desktopie.
Na mobile użyłem w css display: none, ale kod ciągle siedzi w pliku i podczas testu PageSpeed mam małą wydajność.

Moim celem jest wycięcie całego diva z kodu, aby strona miała lepszy wynik testu Pagespeed.
Czy to jest w ogóle możliwe? A może podejście jest złe?

2

A może podejście jest złe?

Tak - Twoje aktualne podejście to hack; w pół roku dorzucisz kilka podobnych (na zasadzie jak tu zrobię .remove(), a tam .insert(), to karuzela się nie będzie aktywowała się na mobilkach) i skończysz z big ball of mud.

Najlepiej byłoby poprawić kod slidera tak, aby rozumiał koncept responsywności i nie inicjował się na mniejszych rozdzielczościach.

3
yacazg napisał(a):

Nie chcę ukrywać tego za pomocą css, ponieważ ten div ma zbyt dużo kodu i mocno zaniża mi to wydajność w pagespeed.
Chcę całkowicie wyeliminować tego diva z kodu strony

Jeśli chcesz go całkowicie wyeliminować z kodu strony, to usuń go z kodu strony po stronie serwera i generuj JS-em dynamicznie na wybranych urządzeniach.

Bo to, że go sobie usuniesz już po załadowaniu nie wypłynie w żaden sposób na wydajność strony, skoro i tak przeglądarka będzie musiała go najpierw pobrać i wyrenderować i dopiero wtedy usunąć.

0

Odpuściłem to podejście i podszedłem do tematu inaczej.

dzięki za rady

1 użytkowników online, w tym zalogowanych: 0, gości: 1