How to replace gui with your interface?

Question

JavaScript

I want to use my own interface instead of dat.gui.
But I don't understand how to adapt

import { GUI } from './dat.gui.module.js';

gui.add( sliceZ, "index", 0, volume.RASDimensions[ 2 ], 1 ).name( "indexZ" ).onChange( function () {

  sliceZ.repaint.call( sliceZ );

} );			

gui.add( volume, "lowerThreshold", volume.min, volume.max, 1 ).name( "Lower Threshold" ).onChange( function () {

  volume.repaintAllSlices();

} );

Into something like this

<input id="test_range" type="range" max='240' min="1">
<script>
document.getElementById("test_range").addEventListener("change", function() {
  sliceX.index = this.value
  console.log(this.value)
});
</script>