{"id":8871,"date":"2014-08-12T05:06:28","date_gmt":"2014-08-11T19:06:28","guid":{"rendered":"http:\/\/www.rjmprogramming.com.au\/wordpress\/?p=8871"},"modified":"2020-06-24T12:52:45","modified_gmt":"2020-06-24T02:52:45","slug":"htmljavascript-hit-counter-primer-tutorial","status":"publish","type":"post","link":"https:\/\/www.rjmprogramming.com.au\/ITblog\/htmljavascript-hit-counter-primer-tutorial\/","title":{"rendered":"HTML\/Javascript Hit Counter Primer Tutorial"},"content":{"rendered":"
\"HTML\/Javascript<\/a>

HTML\/Javascript Hit Counter Primer Tutorial<\/p><\/div>\n

We discussed web page hit counters previously when we had the PHP\/Javascript\/HTML Hit Counter Primer Tutorial<\/a> as shown below, up and going … and lo and behold it is still up and going. It dealt with hit counters on a more general server side way of counting total hits on a web page over time, but today we are going to talk about HTML5 Javascript methods that can help out with session and local-web-browser-based hit counts. This may not immediately sound very interesting because the results go back to 1 when you close the web browser window … but what if you want to ensure somebody doesn’t pay twice with a credit card transaction on an eCommerce website. The Javascript functionality presented here can help out with this situation, and may save your bacon if it becomes known your site can so easily double charge a customer. The scenario I am talking about is the customer opening multiple windows to do with the one transaction. The use of the hit counters in an intelligent way can avoid any bad user usage of your webpage, and please read this link<\/a> regarding the functionality … thanks.<\/p>\n

So the “Session Storage is designed for scenarios where the user is carrying out a single transaction, but could be carrying out multiple transactions in different windows at the same time”<\/i> and the “Local Storage is designed for storage that spans multiple windows, and lasts beyond the current session. In particular, Web applications may wish to store megabytes of user data, such as entire user-authored documents or a user’s mailbox, on the client side for performance reasons”<\/i> … to quote the link<\/a> above again.<\/p>\n

Here we have a live run<\/a> that opens in a new tab, or this live run<\/a> will happen on top of this webpage, and have a look at what happens to the different hit counters.<\/p>\n

Here is some HTML\/Javascript programming source code you could call local_session_hits.html<\/a> … and we hope it helps you out with something you are working on.<\/p>\n

\n

Previous relevant PHP\/Javascript\/HTML Hit Counter Primer Tutorial<\/a> is shown below.<\/p>\n

\"PHP\/Javascript\/HTML<\/a>

PHP\/Javascript\/HTML Hit Counter Primer Tutorial<\/p><\/div>\n

Here is a tutorial that shows a way to create a very rudimentary PHP Hit<\/a> Counter for a particular webpage. By “for a particular webpage” mean that to get a meaningful hit count for a website you probably are best placed to use a statistics package from your web provider or use a tool that the web provider gives you.<\/p>\n

Link to some downloadable PHP programming code … rename to includeoncehc.php<\/a>.<\/p>\n

Link to some downloadable PHP programming code … rename to useofhc.php<\/a>.<\/p>\n

For this tutorial there is some flexibility in regards to what type of HTML element you use to display your Hit Count statistics. The code handles HTML elements with either\/both Javascript DOM concepts of innerHTML<\/em> and\/or value<\/em>. There is flexibility regarding your wording around the 0 (zero) of the HTML h1 element used in useofhc.php too, as long as 0 (zero), or other numbers for that matter, do not appear in your reworked prefixial<\/a> wording.<\/p>\n

You’ll see <meta name=”viewport” content=”width=device-width, initial-scale=1.0″><\/em> in the code for useofhc.php within <head><\/em> and <\/head><\/em> which is code used to make websites user-friendly to mobile phones (and maybe have a look at some of the links of using this<\/a>). Another approach to mobile phone friendly code is to express width values as percentage values, and you’ll see that principle being applied in useofhc.php also. You don’t have PHP? You could use a Javascript Cookie approach? (here<\/a>? … or run tutorial, go View->Page Source with your web browser to get some starting ideas)<\/p>\n

A PHP topic of interest that comes into play regarding this tutorial is the use of require_once()<\/em> and\/versus include_once()<\/em> so take a look at require_once information<\/a> and include_once information<\/a>. You can actually do this job with one PHP where you plugin the contents of includeoncehc.php in place of the require_once()<\/em> call, and you may want to try this. My apologies for the file naming confusion where includeoncehc.php is actually used with a require_once()<\/em> call … but, c’est la vie.<\/p>\n

You might be interested in blinking text, and this is achieved with this tutorial, by the use of <blink><\/em> and <\/blink><\/em>.<\/p>\n

So enjoy this live run here<\/a>.<\/p>\n

Did you know?<\/em><\/strong><\/p>\n

You may notice that the word Javascript does not appear within the code of useofhc.php<\/em> nor includeoncehc.php<\/em> as above, so you may wonder how it can be claimed to involve Javascript. The reason is that Javascript is the default language of the <script> <\/script><\/em> notation, as used in this tutorial, where the PHP writes its own “Javascript” (by implication), and is the default language of HTML element event code as well, so, just as you can have
<a href=”http:\/\/www.youtube.com\/watch?v=h-mX9T2qyIQ#zkWMcRlE1mQ<\/a>” onclick=”alert(‘FUNEX?’);'” title=”Two Ronnies Question”>FUNEX?<\/a><\/em>
you can just as well use syntax like
<a href=”http:\/\/www.youtube.com\/watch?v=h-mX9T2qyIQ#zkWMcRlE1mQ<\/a>” onclick=”Javascript: alert(‘S,VFX’);'” title=”Two Ronnies Answer”>S,VFX<\/a> <\/em>\n<\/p>\n

If this was interesting you may be interested in this<\/a> too.<\/p>\n