• Najnowsze pytania
  • Bez odpowiedzi
  • Zadaj pytanie
  • Kategorie
  • Tagi
  • Zdobyte punkty
  • Ekipa ninja
  • IRC
  • FAQ
  • Regulamin
  • Książki warte uwagi

JS dodawanie class do istniejącego diva z class

VPS Starter Arubacloud
0 głosów
3,924 wizyt
pytanie zadane 5 marca 2018 w JavaScript przez okti00 Obywatel (1,300 p.)

Witam, jestem tu nowy (na tej stronie :P)!

Mam pytanie gdyż chcę zrobić skrypt w JS który dodaje class START do istniejącego diva o class TEST.

Proszę o pomoc gdyż dotychczasowe próby nie działają ;/

3 odpowiedzi

0 głosów
odpowiedź 5 marca 2018 przez Marchiew Dyskutant (7,690 p.)
wybrane 5 marca 2018 przez okti00
 
Najlepsza

spróbuj

document.querySelector(".test").classList.add("start");

 

komentarz 5 marca 2018 przez okti00 Obywatel (1,300 p.)
Super! Działa i dziękuję za bardzo szybką odpowiedz!
komentarz 5 marca 2018 przez Marchiew Dyskutant (7,690 p.)
Ni ma problema
0 głosów
odpowiedź 5 marca 2018 przez Kamil M Bywalec (2,340 p.)
element.classList.add('start')

 

komentarz 5 marca 2018 przez Kamil M Bywalec (2,340 p.)

W razie potrzeby można też usunąć

element.classList.remove('start')

 

komentarz 5 marca 2018 przez okti00 Obywatel (1,300 p.)

@Kamil M, nie bardzo rozumiem, widzę tylko start jako dodawana klasa a gdzie jest klasa diva test ?

komentarz 5 marca 2018 przez Kamil M Bywalec (2,340 p.)
Właściwość classList zawiera już w sobie wszystkie klasy elementu, ty tylko dodajesz/odejmujesz kolejne za pomocą metod .add() / .remove().

Oczywiście najpierw musisz wybrać element, na którym chcesz przeprowadzić działania np. za pomocą document.querySelector(''), który wybiera pierwszy napotkany element z HTML z klasą podaną w nawiasie, albo document.getElementById('') z podanym w nawiasie ID.
0 głosów
odpowiedź 5 marca 2018 przez okti00 Obywatel (1,300 p.)

@Marchiew, Wszystko śmiga jak pisałem lecz, tutaj https://codepen.io/messness/pen/GQbpQr działa jak powinno (tak mam podpięty JS który używam na stronie)

Zaś jak już mam na swojej stronie to animacja nie działa.

Fragment kodu (mniej więcej na środku mojej strony)

echo '<div class="circle"><img src="https://gallery.yopriceville.com/var/albums/Free-Clipart-Pictures/Fire-PNG-/Fireball_PNG_Clipart_Picture.png?m=1434276687" height="100%"></div>';
?>
<script>
document.querySelector(".circle").classList.add("active");
</script>
<?php

Ktoś wie dlaczego może nie działać?

komentarz 5 marca 2018 przez okti00 Obywatel (1,300 p.)
tak, próbowałem dać skrypt przed klasą ale bez skutku
komentarz 5 marca 2018 przez Marchiew Dyskutant (7,690 p.)
Pokaż kod strony już w htmlu
komentarz 5 marca 2018 przez okti00 Obywatel (1,300 p.)
en kod jest umieszczony w pliku game.php który jest includowany w index.php oraz odświeżany przez JS co 2 sek.

 

zauważyłem że jeśli kod jest w pliku index działa a jak już w tym odświeżanym i includowanym to już nie :/
komentarz 7 marca 2018 przez Marchiew Dyskutant (7,690 p.)
Dlatego wyświetl źródło strony i pokaż tutaj. Pewnie ścieżki ci się nie zgadzają, ale to jest zgadywanie, bo nie mam tego przed oczami.
komentarz 7 marca 2018 przez okti00 Obywatel (1,300 p.)

if($_GET['play']=='pve'){
$_camp=mysql_fetch_array(mysql_query("SELECT COUNT(*) FROM camp_log WHERE c_log_status='1' ORDER BY c_log_wave DESC"));
if($_camp['COUNT(*)']==0){
unset($_SESSION['wave']);
$_SESSION['wave']=1;
}else{
unset($_SESSION['wave']);
$_SESSION['wave']=$_camp['COUNT(*)']+1;    
}


echo '<div id="game"><p>Brak obsługi JavaScript lub strona która chcesz wyświetlić nie istnieje</p></div>';
}

Powyżej jest to element w którym wstawiany jest plik game.php (ten odświeżany co 2s)

<?php include('../dbcon.php'); session_start(); ?>
<!doctype html>
<html lang="pl">
  <head>
    <link rel="stylesheet" href="/style/page.css">
    <meta charset="utf-8">
	<link href="https://fonts.googleapis.com/css?family=Catamaran:400,700,900" rel="stylesheet">
	<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">	
    <script src="xyz.js"></script>
<script>
new Ajax.PeriodicalUpdater('game', 'game.php',
{
method: 'get',
frequency: 2,
decay: 0
});
</script>


  </head>

Powyżej sekcja head pliku index.php,

<?php 
include('../dbcon.php'); session_start(); 
... reszta mojego kodu ...
?>

Powyżej sekcja game.php głównie podpięty mam plik z połączeniem bazy. Nie mam tutaj head, strona rozpoczyna się od <?php i kończy ?>

Podobne pytania

0 głosów
1 odpowiedź 1,149 wizyt
0 głosów
0 odpowiedzi 622 wizyt
pytanie zadane 20 czerwca 2018 w JavaScript przez SzukającyPrzygód Bywalec (2,310 p.)
0 głosów
1 odpowiedź 284 wizyt

92,452 zapytań

141,262 odpowiedzi

319,075 komentarzy

61,854 pasjonatów

Motyw:

Akcja Pajacyk

Pajacyk od wielu lat dożywia dzieci. Pomóż klikając w zielony brzuszek na stronie. Dziękujemy! ♡

Oto polecana książka warta uwagi.
Pełną listę książek znajdziesz tutaj.

Akademia Sekuraka

Akademia Sekuraka 2024 zapewnia dostęp do minimum 15 szkoleń online z bezpieczeństwa IT oraz dostęp także do materiałów z edycji Sekurak Academy z roku 2023!

Przy zakupie możecie skorzystać z kodu: pasja-akademia - użyjcie go w koszyku, a uzyskacie rabat -30% na bilety w wersji "Standard"! Więcej informacji na temat akademii 2024 znajdziecie tutaj. Dziękujemy ekipie Sekuraka za taką fajną zniżkę dla wszystkich Pasjonatów!

Akademia Sekuraka

Niedawno wystartował dodruk tej świetnej, rozchwytywanej książki (około 940 stron). Mamy dla Was kod: pasja (wpiszcie go w koszyku), dzięki któremu otrzymujemy 10% zniżki - dziękujemy zaprzyjaźnionej ekipie Sekuraka za taki bonus dla Pasjonatów! Książka to pierwszy tom z serii o ITsec, który łagodnie wprowadzi w świat bezpieczeństwa IT każdą osobę - warto, polecamy!

...