Common js file across multiple htmls and a global variable reference

Question

I need to refer a global variable across multiple html files,each of the multilpe html file is referring to a common js file.

index.html sub1.html sub2.html

in each of the html pages the js is included in the head tag

<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
<link rel="stylesheet" href="/css/Main.css" type="text/css"/>
<script src="/js/Main.js" ></script>
</head>

Navigation from one html to other html is from a js function like.

say from index.html to sub1.html

window.location.href='/forms/sub1.html';

I have declared a global varibale globalCount, to check how many navigations have been done in the global scope of the Main.js

var globalCount=1;

and incremented in the navigation function.

But for each of the html page the globalCount variable is reinitialized to 1, even though the Main.js is NOT downloaded multiple times.

I have tried declaring through window.globalCount, no luck.

Any easy way to have a common global variable across multiple htmls but in the same js file.

Hope you understand the question.

Matt Lo · Accepted Answer · 2012-02-02 03:04:38Z

2

Simple! Use a cookie https://developer.mozilla.org/en/DOM/document.cookie

This will allow you to access your variable through the user's system.

answered Feb 2, 2012 at 3:04

Matt Lo

5,7511 gold badge25 silver badges23 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

omni.present Over a year ago

yup.. that is one of the work around,other one is through html5 local storage,but wanted to know if we can do through the js way,since some users may disable the cookies and for other html5 support is needed.

Matt Lo Over a year ago

another method is to pass query strings but would require some work. (some javascript can help automate it though), HTML5 storage isnt a good option for cross browser compatibility. You have more users who don't support HTML5 storage completely than browsers with cookies disabled.

nnnnnn · Accepted Answer · 2012-02-02 03:29:22Z

2

Your JS file (or any JS file) is not downloaded and run on its own; it doesn't act as a sort of controller that stays in memory while the HTML pages are loaded and replaced. The scope and life-cycle of code in included JS files is essentially the same as for code included inline in an HTML page so when you navigate to a new page the JS is gone even if the new page references the same include file. As you've seen.

If you use a cookie to store your variable's value as per Matt Lo's answer your JS script can get the value from there. Or you could add it as a query string parameter at the end of each page's URL (like 'sub1.html?globalCount=' + globalCount) and access it from there.

(Or you could submit the values and use some sort of server-side technology to echo them back in the new page, but that is overkill.)

answered Feb 2, 2012 at 3:29

nnnnnn

150k30 gold badges210 silver badges247 bronze badges

3 Comments

omni.present Over a year ago

Thanks for the explanation,but I still don't understand why the global variable is reset/refreshed each time for different html,even though it is in the same js file.Need to understand more about how js and DOM works!!

Matt Lo Over a year ago

JS works based on runtime per page. In a software environment's terms, your workspace is reset on page load. This means simply, if you assign a variable in one page, it only lives within that single page request.

Jono Over a year ago

From my experience, in jquery mobile at least, when u cal a href=""somepage.html" and call a JS function that was in the first page, it works as if it is stil loaded in memory or that somepage.html is attached and is part of the first page

Collectives™ on Stack Overflow

Common js file across multiple htmls and a global variable reference

2 Answers 2

2 Comments

3 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

2 Comments

3 Comments

Your Answer

Sign up or log in

Post as a guest

Related