i am new to the world of javascript and would love some help. I have a simple quiz with "range" objects in HTML. Each Value is for the range is displayed with
<input type="range" class="form-range" min="0" max="5" id="input1"
oninput="q1points.value = this.value">
<output id="q1points">0</output>
I'm not sure if this way of displaying the values of my range objects is the way to go if i want to count them together.
I have 5 questions. How do i add these values together i javascript and store them in variables?
function myFunction(){
var val = document.getElementById('input1').value;
document.getElementById('res_1').innerHTML = val;
}<form class="questionForm-1" id="q1" data-question="1">
<div id="qhead" class="d-flex p-2 bd-highlight text-center">
<h1>Question 1</h1>
</div>
<div id="ondertitel" class="d-flex p-2 bd-highlight text-center">
<h2>Ik ervaar rust wanneer ik een duidelijke planning heb voor die dag. </h2>
</div>
<div class="form-check" id="form-check">
<div class="d-flex p-4 text-center">
<label for="customRange2" class="form-label">Example range</label>
<input type="range" class="form-range" min="0" max="5" id="input1">
</div>
</div>
<p id="res_1"></p>
<button id="btn-1" type="button" class="btn btn-danger" onclick="myFunction()">Volgende</button>
</form>