从 Javascript 文件而不是 HTML/CSS 中检索变量值

Question

I apologize if this is a simple issue but I've spent a long time being completely stuck, all guides are retrieving from the HTML file, and as such I have no clue where to even begin or what to search.

        <form class="container" method="post">
            <div class="form-group">
                <input class="form-control" name="title">
            </div>
            <textarea class="form-control" name="content"></textarea>
            <button>add to mongodb</button>
        </form>

From this code in the HTML file, I can retrieve the values inputted,

app.post("/", function(req, res) {
    let newGameData = new gameData ({
        score: req.body.title,
        jumps: req.body.content,
    });
    newGameData.save();
    res.redirect('/')
})

However, instead of retrieving values from HTML forms, I want to retrieve variables from a game inside the HTML, the javascript file containing the below

var score = [];
var jumps = [];

These variables are appended to as the score increases and as the character jumps, at the end of each life, I want to append it to the score, and periodically retrieve this data to be uploaded onto MongoDB, and vice versa I retrieve and display the highscore.

I was thinking to write to a json file that could be uploaded onto MongoDB, though I have no clue how to go about it or if it's valid at all, any help would be greatly appreciated, thank you!

Answer 1

As suggested in the comments, learn about Ajax. This is a sample code:

 let newGameData = { score: title, jumps: content, }; $.post("/", newGameData, function(result) { console.log(result) })

and on the server side, don't redirect, but rather res.send(result).

Answer 2

You need to add type =submit in your button tag add to mongodb