How to sync an html file to another html file

Code Help HTML/CSS/JS
1

Question:
i am trying to add a shop to my html game but it will be in another html file in the the same “game” i want to sync all variables in the game so i can add items and take money. The two files I’m using is shop.html and Level1.html.
Repl link:
< https://replit.com/@AriWale/BestTealSpyware?v=1 >

2

Hi! After looking at your code and question, the best result I can come up with is this:

  1. Make a JS file, title it shopvar.js or something.
  2. Inside this .js file, add your variables like:
var x = 1
var y = 2
  1. Add this between your <head> tags:
<script src = "shopvar.js">
  1. Put this JS into the <script></script> of the HTML file you want to use:
function tester() {
real_x = x;
real_y = y;
alert(real_x + real_y)
}

HTML:

<button type="button" onclick="tester()">CLICK ME</button>

Result:

3

Hope this helps!

3

You could use localStorage to store data that is available to all paths of the host.

window.localStorage.set("name", / *some value */);
window.localStorage.get("name");
5 Likes
4

Could you try to explain this a little bit more? I’m kind of a beginner in HTML

1 Like
5

Ah, no problem man.

This is just defining variables in “shopvar.js” (one of your JS files)

This is “importing” (if you use Python, that should make sense) all the contents from your shopvar.js file (where x and y are declared)

makes an HTML button

Define function used in button

Result!

3 Likes
6

I wouldn’t call that importing, it’s confusing given ES6 introduced actual importing with modules:
module.js:

const someVar = 123l
const someBool = true;

export { someVar, someBool };

index.html:

<!-- ... -->
<script type="module">
import { someVar, someBool } from "module.js";
</script>
<!-- ... -->

Also I believe the user means that they want variables that persist in value when the page is refreshed or when redirected to a different path on the same host, in which case using localStorage is probably the best solution.

1 Like
7

That’s a good option ngl. I chose the method that I used because @AriWale said they were new to HTML. Also, I found this option easier and haven’t really heard of import in JS.

1 Like
8

This topic was automatically closed 7 days after the last reply. New replies are no longer allowed.