Use JavaScript to make a simple counter

  • 2020-07-21 06:49:30
  • OfStack

Design idea

The key to this method is the comprehensive application of Cookie technology and dynamic image characteristics. Using Cookie, the user's data can be recorded on the hard disk of the client. The next time you visit this site, you can read Cookie of the hard disk of the client, and directly know the identity of the visitor and the number of visits and other relevant information. JavaScript accesses Cookie through the ES7en.cookie attribute, which includes name, expiration date, valid domain name, valid URL path, and so on. The name separated by the equals sign and its value are the actual data of Cookie, which in this case is used to store the number of times the visitor visited the page. The dynamic image display can be realized by mapping the image in Web page to an Images array and modifying the properties of the array items under certain conditions. In this example, a set of images is preloaded first. Each time the Web page is called, a new set of images is randomly generated to achieve dynamic fun effect by overwriting the original image.

Source program count html


 < html>

  < head>

  < meta http - equiv= " Content - Type " 

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

  < title> Interest counter < /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){

  // If the visitor's number is no 1 Access, assigns the counter value 1 , or add 1 The cumulative 

  var wwhcount=getcookie( ' wwhcount ' );

  if (wwhcount==null){

  wwhcount=1;

  }

  else{wwhcount + + ;}

  setcookie( ' wwhcount ' ,wwhcount,exp);

  return countdisp(wwhcount)

  }

  function countdisp(countvar){

  // Implementation of random display, insufficient 6 A to 0 Complete, you can adjust the display number 

  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){

  // Gets the number of times the visitor has been visited 

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

  if (endstr== - 1)

  endstr=document.cookie.length;

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

  }

  function getcookie(name){

  // The interception Cookie In the name Information section 

  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){

  // Stores the value of the visitor counter 

  var argv=setcookie.arguments;

  var argc=setcookie.arguments.length;

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

  var domain=(argc>4)?argv[4]:null;

  var secure=(argc > 5)?argv[5]:false;

  document.cookie=name +" = "+ escape(value)

 + ((expires==null)? "   " :( " ;expires= "+ expires.toGMTString()))

 + ((path==null)? "   " :( " ;path= "+ path)) + ((domain==null)? " 

 " :( " ;domain= "+ domain)) + ((secure==true)? " ;secure " : "   " );

  }

  function deletecookie(name){

  // Invalidates the message line and deletes the user's information about the number of visits 

  var exp=new Date();

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

  var cval=getcookie(name);

  document.cookie=name +" = "+ cval +" ;expires= "+ exp.toGMTString();

  }

  < /script>< /p>

  < !  -- Pre-loaded image array -- >

 You are the first  < 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> Time coming! 

  < script language= " JavaScript " >

  // call count() Function to achieve the counter dynamic image display 

  count();

  < /script>

  < /body>

  < /html>

Matters needing attention

Due to the use of JavaScript language, this method is platform-independent and can be applied to Unix, Windows and other platforms. In addition, unlike a visitor counter in the general sense of 1, this counter is specifically used to record the number of times a visitor visits a 1 website.


Related articles: