如何在来自HTML的JSON AJAX请求中添加滑块

<input type="range" id="slider" min="0" max="100" step="1" value="50">

// 获取滑块元素
var slider = document.getElementById("slider");

// 监听滑块值的变化
slider.addEventListener("input", function() {
  // 获取滑块的值
  var sliderValue = slider.value;

  // 创建一个包含滑块值的JSON对象
  var jsonData = {
    sliderValue: sliderValue
  };

  // 发送AJAX请求，将JSON对象作为数据发送到服务器
  var xhr = new XMLHttpRequest();
  xhr.open("POST", "url", true);
  xhr.setRequestHeader("Content-Type", "application/json;charset=UTF-8");
  xhr.send(JSON.stringify(jsonData));
});

const express = require('express');
const bodyParser = require('body-parser');
const app = express();
app.use(bodyParser.json());

app.post('/url', function(req, res) {
  // 解析接收到的JSON数据
  var sliderValue = req.body.sliderValue;

  // 执行相应的操作，如保存到数据库或进行其他业务逻辑处理

  // 返回响应
  res.send("Slider value received: " + sliderValue);
});

app.listen(3000, function() {
  console.log('Server listening on port 3000');
});