Maison  >  Article  >  interface Web  >  Introduction détaillée à l'utilisation de document.cookie en Javascript

Introduction détaillée à l'utilisation de document.cookie en Javascript

黄舟
黄舟original
2017-03-22 14:35:301194parcourir

Cet article présente principalement l'utilisation de document.cookie en Javascript, et la fonction de mémorisation des mots de passe et d'enregistrement des mots de passe via les cookies. Les amis dans le besoin peuvent se référer à

<.>Définir un cookie

Chaque cookie est une paire nom/valeur Vous pouvez attribuer la chaîne suivante à document.cookie :

document.cookie="userId=828";
Si vous. souhaitez stocker plusieurs paires nom/valeur à la fois, vous pouvez utiliser des points-virgules et des espaces (;) pour les séparer, par exemple :

document.cookie="userId=828; userName=hulk";
Vous ne pouvez pas utiliser de points-virgules (;) dans les noms ou les valeurs des cookies. , virgule (,), signe égal (=) et espace.

C'est facile de faire cela au nom du cookie, mais la valeur à enregistrer n'est pas définie. Comment stocker ces valeurs ? La méthode

est codée à l'aide de la fonction escape()

, qui peut exprimer certains symboles spéciaux en hexadécimal. Par exemple, les espaces seront codés sous la forme "20%", qui peuvent être stockés dans. valeur du cookie, et l'utilisation de cette solution peut également éviter l'apparition de caractères chinois tronqués. Par exemple :

document.cookie="str="+escape("I love ajax");
équivaut à : document.cookie="str=I%20love%20ajax";

Lorsque vous utilisez l'encodage escape(), vous devez utiliser unescape() après avoir extrait la valeur) pour obtenir la valeur originale du cookie, qui a été introduite auparavant. Bien que document.cookie ressemble à une propriété et puisse se voir attribuer différentes valeurs. Mais c'est différent des attributs généraux. Changer son affectation ne signifie pas perdre la valeur d'origine. Par exemple, si vous exécutez les deux instructions suivantes en continu :

document.cookie="userId=828";
document.cookie="userName=hulk";
A ce moment, le navigateur conservera deux cookies. , respectivement. sont userId et userName, donc attribuer une valeur à document.cookie revient plus à exécuter une instruction comme celle-ci :

document.addCookie("userId=828");
document.addCookie("userName=hulk");
En fait, le navigateur définit les cookies de cette manière si vous souhaitez modifier. la valeur d'un cookie, réaffectez simplement la valeur, par exemple :

document.cookie="userId=929";
Cela définira la valeur du cookie nommée userId sur 929.

Obtenir la valeur du cookie

Ce qui suit décrit comment obtenir la valeur du cookie. La valeur du cookie peut être obtenue directement à partir de document.cookie :

var strCookie=document.cookie;
Cela obtiendra une chaîne composée de plusieurs paires nom/valeur séparées par des points-virgules, qui incluent le nom de domaine Tous les cookies sous. Par exemple :

On peut voir que toutes les valeurs des cookies ne peuvent être obtenues qu'en une seule fois, mais le nom du cookie ne peut pas être spécifié pour obtenir la valeur spécifiée. C'est la partie la plus gênante de. traiter les valeurs des cookies.

Les utilisateurs doivent analyser cette chaîne eux-mêmes pour obtenir la valeur du cookie spécifiée. Par exemple, pour obtenir la valeur de userId, vous pouvez faire ceci :

De cette façon, vous obtenez la valeur de. un seul cookie

En utilisant une méthode similaire, vous pouvez obtenir la valeur d'un ou plusieurs cookies. La technique principale reste les opérations liées aux chaînes et aux tableaux.

Définissez la date d'expiration des cookies. Jusqu'à présent, tous les cookies étaient des cookies à session unique, c'est-à-dire que ces cookies seront perdus après la fermeture du navigateur. En fait, ces cookies ne sont stockés qu'en mémoire sans. établir un fichier de disque dur correspondant.

Dans le développement réel, les cookies doivent souvent être enregistrés pendant une longue période, comme par exemple l'enregistrement du statut de connexion de l'utilisateur. Ceci peut être réalisé en utilisant les options suivantes :

document.cookie="userId=828;
expires=GMT_String";
où GMT_String est une chaîne de temps exprimée au format GMT. Cette instruction définit le cookie userId sur le délai d'expiration représenté par GMT_String. le cookie disparaîtra et deviendra inaccessible. Par exemple :

Si vous souhaitez qu'un cookie expire après 10 jours, vous pouvez le faire comme ceci :

<script language="JavaScript" type="text/javascript">
<!-- //获取当前时间
var date=new Date();
var expireDays=10; //将date设置为10天以后的时间
date.setTime(date.getTime()+expireDays*24*3600*1000); //将userId和userName两个cookie设置为10天后过期
document.cookie="userId=828; userName=hulk;
expire="+date.toGMTString(); //-->
</script>

Supprimer le cookie

Afin de supprimer un cookie, vous pouvez fixer son heure d'expiration à une heure passée, par exemple :

<script language="JavaScript" type="text/javascript">
<!--
//获取当前时间
var date=new Date();
//将date设置为过去的时间
date.setTime(date.getTime()-10000);
//将userId这个cookie删除
document.cookie="userId=828; expire="+date.toGMTString();
//-->
</script>
Précisez le chemin d'accès au cookie. Par défaut, si un cookie est créé sur une page, alors les autres pages du répertoire où se trouve la page peuvent également accéder au cookie

. S'il existe des sous-répertoires sous ce répertoire, vous pouvez également y accéder dans les sous-répertoires.

Afin de contrôler le répertoire auquel les cookies peuvent accéder, vous devez utiliser le paramètre path pour définir les cookies. La syntaxe est la suivante :


document.cookie="name=value; path=cookieDir";
où cookieDir représente le. répertoire dans lequel les cookies sont accessibles. Par exemple :

document.cookie="userId=320; path=/shop";
signifie que le cookie actuel ne peut être utilisé que dans l'annuaire de la boutique.

Si vous souhaitez rendre les cookies disponibles sur tout le site Web, vous pouvez spécifier cookie_dir comme répertoire racine, par exemple :

document.cookie="userId=320; path=/";
Spécifiez le nom d'hôte et le chemin qui peuvent accéder aux cookies. le nom d'hôte fait référence aux mêmes différents hôtes sous un même domaine, par exemple : www.google.com et gmail.google.com sont

deux noms d'hôte différents. Par défaut, les cookies créés sur un hébergeur ne sont pas accessibles sur un autre hébergeur, mais ils peuvent être contrôlés via le paramètre de domaine. Le format de syntaxe est :

document.cookie="name=value;
domain=cookieDomain";
Prenez Google comme Par exemple, pour réaliser un inter-hôte. accès, vous pouvez écrire :

document.cookie="name=value;
domain=.google.com";
De cette manière, tous les hébergeurs sous google.com peuvent accéder au cookie.

Exemple complet : construction d'une fonction universelle de traitement des cookies Le processus de traitement des cookies est relativement complexe et présente certaines similitudes. Par conséquent, plusieurs fonctions peuvent être définies pour compléter les

opérations générales des cookies, réalisant ainsi la réutilisation du code. Les opérations courantes de cookies et leurs implémentations de fonctions sont répertoriées ci-dessous.

1.添加一个cookie:addCookie(name,value,expireHours) 该函数接收3个参数:cookie名称,cookie值,以及在多少小时后过期。

这里约定expireHours为0时不设定过期时间,即当浏览器关闭时cookie自动消失。该函数实现如下:

<script language="JavaScript" type="text/javascript">
<!--
function addCookie(name,value,expireHours){
       var cookieString=name+"="+escape(value);
       //判断是否设置过期时间
       if(expireHours>0){
          var date=new Date();
          date.setTime(date.getTime+expireHours*3600*1000);
          cookieString=cookieString+"; expire="+date.toGMTString();
       }
       document.cookie=cookieString;
}
//-->
</script>

2.获取指定名称的cookie值:getCookie(name)

该函数返回名称为name的cookie值,如果不存在则返回空,其实现如下:

<script language="JavaScript" type="text/javascript">
<!--
function getCookie(name){
       var strCookie=document.cookie;
       var arrCookie=strCookie.split("; ");
       for(var i=0;i<arrCookie.length;i++){
          var arr=arrCookie[i].split("=");
          if(arr[0]==name)return arr[1];
       }
       return "";
}
//-->
</script>

3.删除指定名称的cookie:deleteCookie(name)

该函数可以删除指定名称的cookie,其实现如下:

<script language="JavaScript" type="text/javascript">
<!--
function deleteCookie(name){
       var date=new Date();
       date.setTime(date.getTime()-10000);
       document.cookie=name+"=v; expire="+date.toGMTString();
}
//-->
</script>

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Déclaration:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn