document.getElementById non funziona

16-05-2020, 07.33.08

Ho messo così ma non funziona

Codice PHP:


#feste {
    font-family: times;
    font-size: 1.5em; 
    font-style: italic; 
    color: #ff5100; 
    margin-top: 10px;
    display: block;
    text-align: center;
}

<script>
                
  function feste() {
    var calendario = new Date();
    var giorno = calendario.getDate();
    var mese = calendario.getMonth() + 1; // Gennaio=1
    if ((giorno >= 1 && mese == 5) || (giorno <= 2 && mese == 1))                                               document.getElementById("feste").innerHTML = "Buone Feste!";
    }
  }
feste(); 
</script>

**alemoppo** · 16-05-2020, 07.52.07

Deve esistere l'elemento HTML con quell'id.

Inoltre feste() ti consiglio di chiamarlo al caricamento della pagina.

Ciao!

16-05-2020, 07.56.50

Così, ma non va.

Codice:

 <body onload="feste();"> 	   	
  function feste() {
    var calendario = new Date();
    var giorno = calendario.getDate();
    var mese = calendario.getMonth() + 1; // Gennaio=1
    if ((giorno >= 1 && mese == 5) || (giorno <= 2 && mese == 1)) {
      
      document.getElementById("feste").innerHTML = "Buone Feste!";
    }
  }
feste();

**alemoppo** · 16-05-2020, 08.11.56

Deve esistere l'elemento HTML che ha quell'id! E comunque intendevo:

Codice HTML:

<!doctype html>
<html lang="it">
<head>
<title> pagina di prova </title>
<style>
#feste {
    font-family: times;
    font-size: 1.5em; 
    font-style: italic; 
    color: #ff5100; 
    margin-top: 10px;
    display: block;
    text-align: center;
}
</style>
<script>
function feste() {
    var calendario = new Date();
    var giorno = calendario.getDate();
    var mese = calendario.getMonth() + 1; // Gennaio=1
    if ((giorno >= 1 && mese == 5) || (giorno <= 2 && mese == 1)) {
      
      document.getElementById("feste").innerHTML = "Buone Feste!";
    }
  }
  
  window.addEventListener('load', feste);
  
</script>

</head>
<body>
<p id="feste"></p>
</body>
</html>

Ciao!

16-05-2020, 08.21.05

Ho messo il tuo ma non funziona, se invece metto questo funziona:

Codice:

<script>
  //Feste dal 1-12 al 2-1		   	
  function feste() {
    var calendario = new Date();
    var giorno = calendario.getDate();
    var mese = calendario.getMonth() + 1; // Gennaio=1
    if ((giorno >= 1 && mese == 5) || (giorno <= 2 && mese == 1)) {
      document.write('<span class="feste">Buone Feste!</span>');
    }
  }
feste(); 
</script>

**alemoppo** · 16-05-2020, 08.29.23

Originalmente inviato da albenessereblog

Ho messo il tuo ma non funziona

In che senso non funziona? Come lo hai inserito? Dove?

Ciao!

16-05-2020, 08.59.05

Il tuo script l'ho messo al posto del mio originale, col tuo non appare "Buone Feste!"

Ho letto che mettendo document.getElementById funziona meglio, però non so, volevo cambiarlo.

**alemoppo** · 16-05-2020, 09.11.43

Rileggi le mie risposte precedenti. Non è sufficiente "inserire lo script" per visualizzare il risultato.

Come vedi nella pagina che ti ho indicato, funziona correttamente. Però occorre utilizzarlo nel giusto modo!

Non ho modificato lo script Javascript (né entrato nel merito del suo funzionamento): ho semplicemente copiato il tuo script indicato inizialmente.

Il tuo script "che funziona" scrive l'elemento HTML (che dicevo non essere presente) tramite la document.write. In questo caso puoi anche utilizzare quella soluzione, ma hai impostato la classe CSS e non l'id: le regole CSS che hai specificato inizialmente non verranno utilizzate.

Nota che io ho aggiunto l'elemento HTML <p id="feste"></p>
La tua document.write scrive direttamente: <span class="feste">Buone Feste!</span>

Ho letto che mettendo document.getElementById funziona meglio

Non è che funziona meglio; sono cose differenti: la document.write puoi utilizzarla solamente durante il caricamento della pagina. La getElementById().innerHTML va utilizzata praticamente solo dopo il caricamento della pagina.
Si tratta comunque di due cose completamente differenti, con la getElementById puoi variare anche altre proprietà come ad esempio gli stili CSS (comunque dopo il caricamento della pagina).

Ciao!

16-05-2020, 09.29.08

Adesso funziona, forse avevo sbagliato qualcosa io.

Però, secondo te è meglio che la scritta appare subito o un pò dopo anche per il SEO? Io penso che il visitatore è più contento se vede tutto subito, o no?

Funziona anche se metto span id

**alemoppo** · 16-05-2020, 09.39.31

Originalmente inviato da albenessereblog

Funziona anche se metto span id

Certo, qualsiasi elemento HTML con l'id corretto funziona. Vedrai che funzionerà anche utilizzando <div id=..>.

Originalmente inviato da albenessereblog

Però, secondo te è meglio che la scritta appare subito o un pò dopo anche per il SEO? Io penso che il visitatore è più contento se vede tutto subito, o no?

Per il SEO è indifferente, visto che la scritta non compare tutti i giorni. A livello utente che la scritta "buone feste" appaia dopo il caricamento della pagina non credo influisca troppo. Però nel tuo caso la document.write() va benissimo perché fa quel che vuoi: non ha senso (in questo caso) attendere il caricamento della pagina.

La cosa migliore comunque sarebbe farlo tramite PHP, perché eviti appunto di dover utilizzare javascript (non tutti i motori di ricerca lo interpretano e non è garantito che tutti i visitatori abbiano javascript attivo).

Ciao!

16-05-2020, 09.44.49

PHP è più pesante, se uno non ha attivo JS non vede le cose, non credo che esista un singolo utente che naviga con i JS disattivati.

In PHP carica subito?

**alemoppo** · 16-05-2020, 09.58.49

Originalmente inviato da albenessereblog

PHP è più pesante

Puoi spiegare meglio? In che senso?

Originalmente inviato da albenessereblog

non credo che esista un singolo utente che naviga con i JS disattivati.

Praticamente è vero, ma mi è capitato di vedere qualcuno con JS disabilitato.

Originalmente inviato da albenessereblog

In PHP carica subito?

PHP agisce durante la generazione della pagina, è come se scrivessi l'HTML ogni volta; per farti capire, guarda l'HTML di questa pagina: lo script l'utente non lo vede nemmeno (perché è appunto PHP).

Il codice della pagina è:

Codice PHP:


<span><?php
$giorno = date('d');
$mese = date('m');
if (($giorno >= 1 && $mese == 5) || ($giorno <= 2 && $mese == 1))
    echo 'Buone Feste!';
?></span>

(ovviamente manca tutto il resto della pagina, come <html> <body> etc).

Ciao!

16-05-2020, 10.08.53

Per più pesante intendo che deve fare una chiamata apposita nel server e poi lo deve trasformare in HTML, o sbaglio?
Però è più sicuro.

**alemoppo** · 16-05-2020, 10.10.25

Originalmente inviato da albenessereblog

Per più pesante intendo che deve fare una chiamata apposita nel server e poi lo deve trasformare in HTML, o sbaglio?

Ni, non è noto come sia il funzionamento dei server, si tratta comunque di un tempo di attesa trascurabile, di alcuni ordini di grandezza inferiori rispetto al tempo di attesa del transito dei dati dal server all'utente.

Ciao!

16-05-2020, 10.14.55

Allora tengo il php

Discussione: document.getElementById non funziona

LinkBack

Strumenti discussione

Display

document.getElementById non funziona

Regole di scrittura