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

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

黄舟
Libérer: 2017-03-22 14:35:30
original
1211 Les gens l'ont consulté

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";
Copier après la connexion
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";
Copier après la connexion
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");
Copier après la connexion
é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";
Copier après la connexion
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");
Copier après la connexion
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";
Copier après la connexion
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;
Copier après la connexion
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 :

Copier après la connexion
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 :

Copier après la connexion
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";
Copier après la connexion
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>
Copier après la connexion

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>
Copier après la connexion
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";
Copier après la connexion
où cookieDir représente le. répertoire dans lequel les cookies sont accessibles. Par exemple :

document.cookie="userId=320; path=/shop";
Copier après la connexion
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=/";
Copier après la connexion
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";
Copier après la connexion
Prenez Google comme Par exemple, pour réaliser un inter-hôte. accès, vous pouvez écrire :

document.cookie="name=value;
domain=.google.com";
Copier après la connexion
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>
Copier après la connexion

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>
Copier après la connexion

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>
Copier après la connexion

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!

Étiquettes associées:
source:php.cn
Déclaration de ce site Web
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
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal