Armazenando e recuperando dados de cookies com JavaScript

Cookies são usados pra salvar dados na máquina cliente. Nada mais são do que arquivos textos.

Os campos são armazenados no formato→ Campo=Valor;.
Naquele exemplo pra alternar arquivos do tipo CSS em Estilo o nome do arquivo CSS pode ser armazenado num cookie.

O único porém do uso de cookies é que os navegadores podem bloqueá-los.
Pros exemplos abaixo funcionarem é necessário configurar o navegador pra Aceitar cookies.


<html>
  <head>
    <script type="text/javascript">
      function ArmazenarCookie (Identificador, Valor)

      {
        var DataHora;

        DataHora       = new Date (2030, 1, 1);
        document.cookie= Identificador + '=' + Valor + '; expires=' + DataHora.toGMTString () + '; path=/';
      }

      function RecuperarCookie (Identificador)

      {
        var Caracter, Frase, I, Identificado, N;
        
        I           = 0;
        N           = document.cookie.length;
        Frase       = '';
        Identificado= false;
        
        while (I < N) {
          Caracter= document.cookie.charAt (I);
          if (Caracter == ';') {
            if (Identificado)
              break;
            else
              Frase= '';
          }
          else if (Caracter == '=') {
            if (Frase == Identificador)
              Identificado= true;
            Frase= '';
          }
          else if ((Caracter != ' ') || Identificado)
            Frase= Frase + Caracter;
          I= I + 1;
        }
        
        if (Identificado)
          return Frase;
        else
          return '';
      }

      function Listar ()

      {
        var DataHora;

        DataHora= new Date ();

        ArmazenarCookie ('ExemploCookie_Data', DataHora.toLocaleDateString ());
        ArmazenarCookie ('ExemploCookie_Hora', DataHora.toLocaleTimeString ());
        ArmazenarCookie ('ExemploCookie_Dindin', '$DiN DiN$');

        Paragrafo.innerHTML+= 'ExemploCookie_Data: ' + RecuperarCookie ('ExemploCookie_Data') + '<br>';
        Paragrafo.innerHTML+= 'ExemploCookie_Hora: ' + RecuperarCookie ('ExemploCookie_Hora') + '<br>';
        Paragrafo.innerHTML+= 'ExemploCookie_Dindin: ' + RecuperarCookie ('ExemploCookie_Dindin') + '<br>';
      }
    </script>
  </head>
  <body onload="javascript: Listar ();">
    <p id="Paragrafo"></p>
  </body>
</html>
Clique aqui pra abrir no navegador




O código abaixo simplesmente mostra o conteúdo do atributo Cookie.


<html>
  <head>
    <script type="text/javascript">
      function Listar ()

      {
        if (document.cookie == '')
          Paragrafo.innerHTML= 'Sem cookie';
        else
          Paragrafo.innerHTML= document.cookie;
      }
    </script>
  </head>
  <body onload="javascript: Listar ();">
    <p id="Paragrafo"></p>
  </body>
</html>
Clique aqui pra abrir no navegador





http://transeberiano.brinkster.net