in che modo i siti Web rilevano la risoluzione dello schermo

Poiché il codice Javascript del lato client ha accesso a quel tipo di informazioni.

Se vai al link (a cui il tuo link si collega) e premi ctrl + u per visualizzare il codice sorgente della pagina (lato client) , vedrai cose come questa:

            <div class="col-md-4 col-md-offset-2 well">
                <h3>jQuery code to get window resolution:</h3>
                <p class="codeSection">
                    ; (function () {<br />
                    &nbsp; &nbsp; &nbsp;$(window).width();<br />
                    &nbsp; &nbsp; &nbsp;$(window).height();<br />
                    })();<br />
                </p>
            </div>

Se non è ovvio, $(window).width(); e $(window).height(); sono le parti importanti qui.

Si noti che il "sito web" (ad esempio, il server che ti ha inviato questa pagina HTML con bit di Javascript al suo interno) non ha accesso diretto a queste informazioni. Possono ottenere solo se il tuo browser esegue un codice Javascript che lo rimanda a loro, cosa che questa pagina potrebbe o non potrebbe fare.

La documentazione per l'oggetto window elenca diverse proprietà aggiuntive correlate alla dimensione e scorrere la posizione e altre cose a cui tutto il codice Javascript ha accesso.

Poiché hai menzionato anche l'ora locale, ecco la documentazione per Date oggetto . Il bit chiave è che new Date() creerà un oggetto Date impostato sulla data e l'ora correnti nel fuso orario locale dell'utente.

Sul sito web che hai collegato, questo è fatto (e quindi rifatto ogni 10 secondi) in:

    function UpdateTime() {
        $('.local-time').text(formatAMPM(new Date()));
        setTimeout(function () { UpdateTime() }, 10000)
    };

E infine, un sito web può mostrare se è abilitato o meno il Javascript visualizzando "No" per impostazione predefinita:

            <td style="width: 50%;">JavaScript Enabled:</td>
            <td class="js-enabled bold">No</td>

e con un pezzo di codice Javascript che cambia il "No" in un "Sì":

        $('.js-enabled').text('Yes');

Se il tuo browser rifiuta di eseguire Javascript, vedi il "No". Se viene eseguito, viene visualizzato "Sì".

Il sito mostra come è fatto, in realtà. Ha un link al link che mostra due snippet in basso:

Codice JavaScript per ottenere la risoluzione dello schermo:

<script type="text/javascript">
document.write(screen.width + 'x' + screen.height);
</script>

Codice jQuery per ottenere la risoluzione della finestra:

; (function () {
     $(window).width();
     $(window).height();
})();