Сам код HTML
<div class="wrap">
<div class="input__item">
<input class="input__range" type="range" min="0" max="450" value="0" step="10">
<span class="input__value">0 м</span>
</div>
<div class="input__item">
<input class="input__range" type="range" min="0" max="150" value="0" step="10">
<span class="input__value">0 м</span>
</div>
<div class="result">0 м</div>
</div>
CSS
.input__item {
margin-bottom: 15px;
}
JS
const inputRange = document.querySelectorAll('.input__range');
inputRange.forEach(el => {
el.addEventListener('input', (e) => {
const target = e.target;
let val = target.value;
let text = target.parentElement.querySelector('.input__value');
let num = parseFloat(target.value / 100);
text.textContent = num + ' m';
});
});