Comment créer un compteur simple en utilisant JavaScript_Basics

Pensées de conception

La clé de cette méthode est l'utilisation complète de la technologie des cookies et des caractéristiques dynamiques des images. Grâce aux cookies, les données de l'utilisateur peuvent être enregistrées sur le disque dur de l'utilisateur. La prochaine fois que vous visiterez ce site, vous pourrez lire le cookie sur le disque dur de l'utilisateur et connaître directement l'identité du visiteur, le nombre de visites et d'autres informations pertinentes. Les cookies sont accessibles en JavaScript via l'attribut document.cookie, qui inclut le nom, la date d'expiration, le nom de domaine valide, le chemin d'URL valide, etc. Le nom et sa valeur séparés par le signe égal sont les données réelles du cookie, qui dans ce cas est utilisé pour stocker le nombre de fois que le visiteur a visité la page. En mappant les images de la page Web sur un tableau Images et en modifiant les caractéristiques des éléments du tableau dans certaines conditions, un affichage dynamique des images peut être obtenu. Dans cet exemple, un ensemble d'images est d'abord préchargé. Chaque fois que la page Web est appelée, un nouvel ensemble d'images est généré de manière aléatoire et un effet dynamique et intéressant est obtenu en écrasant les images originales.

Nombre de programmes sources.html

　< html>

　　< head>

　　< meta http－equiv=″Content－Type″

　　content=″text/html; charset=gb2312″>

　　< title>趣味计数器< /title>

　　< /head>

　　< body>

　　< p>< script language=″JavaScript″>

　　var expdays=60;

　　var exp=new Date();

　　exp.setTime(exp.getTime()

　　(expdays＊24＊60＊60＊1000));

　　function count(info){

　　//若是该访客的第一次访问，将计数器值赋1，否则加1累积

　　var wwhcount=getcookie(′wwhcount′);

　　if (wwhcount==null){

　　wwhcount=1;

　　}

　　else{wwhcount＋＋;}

　　setcookie(′wwhcount′,wwhcount,exp);

　　return countdisp(wwhcount)

　　}

　　function countdisp(countvar){

　　//实现随机显示，不足6位以0补全，可以自己调整显示位数

　　var countvar1=″000000″＋countvar;

　　var howFar1=countvar1.length;

　　countvar1=countvar1.substring(howFar1, howFar1－1)

　　var index=″ ″＋Math.floor(Math.random()＊10);

　　if (index==″10″){

　　index=″0″};

　　for (var icount=0;icount< 6;icount＋＋){

　　var g=countvar1.substring(icount,icount＋1);

　　document.images[icount].src=″http:

　　//localhost/images/″＋index＋g＋″.gif″;

　　}

　　}

　　function getCookieVal(offset){

　　//获取该访问者的已访问次数

　　var endstr=document.cookie.indexOf(″;″,offset);

　　if (endstr==－1)

　　endstr=document.cookie.length;

　　return unescape(document.cookie.substring(offset,endstr));

　　}

　　function getcookie(name){

　　//截取Cookie中的name信息段

　　var arg=name＋″=″;

　　var alen=arg.length;

　　var clen=document.cookie.length;

　　var i=0;

　　while (i< clen){

　　var j=i＋alen;

　　if (document.cookie.substring(i,j)==arg)

　　return getCookieVal(j);

　　i=document.cookie.indexOf(″ ″,i)＋1;

　　if (i==0) break;}

　　return null;

　　}

　　function setcookie(name,value){

　　//存储该访客计数器的数值

　　var argv=setcookie.arguments;

　　var argc=setcookie.arguments.length;

　　var expires=(argc>2)&#63;argv[2]:null;var path=(argc>3)&#63;argv[3]:null;

　　var domain=(argc>4)&#63;argv[4]:null;

　　var secure=(argc〉5)&#63;argv[5]:false;

　　document.cookie=name＋″=″＋escape(value)

　　＋((expires==null)&#63;″ ″:(″;expires=″＋expires.toGMTString()))

　　＋((path==null)&#63;″ ″:(″;path=″＋path))＋((domain==null)&#63;″

　　″:(″;domain=″＋domain))＋((secure==true)&#63;″;secure″:″ ″);

　　}

　　function deletecookie(name){

　　//使该信息行失效，删除该用户关于访问次数的信息

　　var exp=new Date();

　　exp.setTime(exp.getTime()－1);

　　var cval=getcookie(name);

　　document.cookie=name＋″=″＋cval＋″;expires=″＋exp.toGMTString();

　　}

　　< /script>< /p>

　　< ! －－预载入图像数组－－>

　　您是第 < img src=″http://localhost/images/00.gif″ height=20 width=20>

　　< img src=″http://localhost/images/00.gif″

　　height=20 width=20>

　　< img src=″http://localhost/images/00.gif″

　　height=20 width=20>

　　< img src=″http://localhost/images/00.gif″

　　height=20 width=20>

　　< I mg src=″http://localhost/images/00.gif″

　　height=20 width=20>

　　< img src=″http://localhost/images/00.gif″

　　height=20 width=20>次光临！

　　< script language=″JavaScript″>

　　//调用count()函数，实现计数器的动态图像显示

　　count();

　　< /script>

　　< /body>

　　< /html>

Choses à noter

Le langage JavaScript étant utilisé, cette méthode est indépendante de la plateforme d'application et peut être appliquée à Unix, Windows et d'autres plateformes. De plus, ce compteur est différent du compteur de visiteurs général et est spécifiquement utilisé pour enregistrer le nombre de fois qu'un visiteur visite un certain site Web.