Maison  >  Article  >  interface Web  >  Utilisation des cookies JavaScript (concept, paramétrage, lecture et suppression)

Utilisation des cookies JavaScript (concept, paramétrage, lecture et suppression)

高洛峰
高洛峰original
2017-01-18 13:20:321304parcourir

Les exemples de cet article décrivent l'utilisation du cookie javascript. Partagez-le avec tout le monde pour votre référence, les détails sont les suivants :

1. Qu'est-ce qu'un cookie ?

Les cookies sont utilisés par les pages pour enregistrer des informations, telles que la connexion automatique, la mémorisation des noms d'utilisateur, etc.

2. Caractéristiques des cookies

Toutes les pages d'un même site Web partagent un ensemble de cookies

Les cookies ont des restrictions de quantité et de taille

Les cookies ont une date d'expiration temps

3. Comment utiliser les cookies ?

Écrivez des cookies via document.cookie

<!DOCTYPE HTML>
<html>
<head>
 <meta charset="UTF-8">
 <title>cookie基础</title>
</head>
<body>
</body>
</html>
<script type="text/javascript">
document.cookie = &#39;username=abc&#39;;
document.cookie = &#39;password=123&#39;;
document.cookie = &#39;email=abcdef@123.com&#39;;
</script>

Ouvrez le navigateur pour afficher les cookies, vous constaterez que le cookie nouvellement défini n'écrasera pas celui d'origine.

Si aucun délai d'expiration n'est défini, la fermeture du navigateur effacera le cookie. Comment régler le délai d'expiration ? La réponse est : expire. Généralement, nous l'utiliserons conjointement avec des objets Date.

var d = new Date();
d.setTime(d.getTime() + 1 * 3600 * 1000);
document.cookie = &#39;username=abc; expires=&#39; + d.toGMTString();

Nous pouvons voir grâce à Firefox que le délai d'expiration du nom d'utilisateur est 1 heure après l'heure actuelle.

Enfin, encapsulez la méthode d'obtention des cookies :

function setCookie(name,value,hours){ 
 var d = new Date();
 d.setTime(d.getTime() + hours * 3600 * 1000);
 document.cookie = name + &#39;=&#39; + value + &#39;; expires=&#39; + d.toGMTString();
}

Maintenant que vous avez appris à paramétrer les cookies, comment lisez-vous les cookies ?

Tout d’abord, regardons quel type de contenu se trouve dans le cookie ?

document.cookie = &#39;username=abc&#39;;
document.cookie = &#39;password=123&#39;;
document.cookie = &#39;email=abcdef@123.com&#39;;
typeof document.cookie; //string
alert(document.cookie); //&#39;username=abc; password=123; email=abcdef@123.com&#39;

Ce que vous obtenez est une chaîne. Il convient de noter qu'il y a un espace après chaque ;.

Alors, comment pouvons-nous obtenir la valeur spécifique ? Code ci-joint :

function getCookie(name){ 
 var arr = document.cookie.split(&#39;; &#39;);
 for(var i = 0; i < arr.length; i++){
 var temp = arr[i].split(&#39;=&#39;);
 if(temp[0] == name){
  return temp[1];
 }
 }
 return &#39;&#39;;
}

En plus de définir et d'obtenir des cookies, nous pouvons également supprimer les cookies. Nous voyons souvent des fonctions telles que la suppression des noms d'utilisateur sur Internet, qui utilisent en réalité la suppression des cookies.

Effacer les cookies est en fait très simple, il suffit de régler le délai d'expiration sur l'heure passée.

function removeCookie(name){
 var d = new Date();
 d.setTime(d.getTime() - 10000);
 document.cookie = name + &#39;=1; expires=&#39; + d.toGMTString();
}

Enfin, nous encapsulons la configuration, l'obtention et la suppression des cookies dans un cookie.js

?

1234567891011121314151617181920 function setCookie(name,value,hours){ var d = new Date(); d.setTime(d.getTime() heures * 3600 * 1000); document.cookie = nom '=' valeur '; expires=' d.toGMTString();}function getCookie(name){ var arr = document.cookie.split('; '); for(var i = 0; i < arr.length; i ){ var temp = arr[i].split('='); == nom){ return temp[1]; } return '';}function removeCookie(name){ var d = new Date(); '=1; expires=' d.toGMTString();}

J'espère que cet article sera utile à tout le monde dans la programmation JavaScript.

Pour des tutoriels plus basiques sur l'utilisation des cookies JavaScript (concepts, paramètres, lecture et suppression), veuillez faire attention au site Web PHP 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