一个关于textarea标签如何用js获取的问题

一个关于textarea标签如何用js获取的问题

我搞了个md编辑器的代码,前端html加js,然后后端是django。
这个逻辑也很简单,就是用户在一个文本框里输入一串md代码,前端通过js去服务器里的/tool/md路径获取文本框里翻译出来的html再嵌套到html里。
现在的问题是那个js获取的内容好像不是动态的,不是跟着用户输入的来的。
下面是前端代码:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title </title>
    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap.min.css"
          integrity="sha384-HSMxcRTRxnN+Bdg0JdbxYKrThecOKuH5zCYotlSAcp1+c8xmyTe9GYg1l9a69psu" crossorigin="anonymous">
    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap-theme.min.css"
          integrity="sha384-6pzBo3FDv/PJ8r2KRkGHifhEocL+1X2rVCTTkUfGk7/0pbek5mMa1upzvWbrUbOZ" crossorigin="anonymous">
    <script src="https://stackpath.bootstrapcdn.com/bootstrap/3.4.1/js/bootstrap.min.js"
            integrity="sha384-aJ21OjlMXNL5UyIl/XNwTMqvzeRMZH2w8c5cRVpzpU8Y5bApTppSuUkhZXN0VxHd"
            crossorigin="anonymous"></script>
</head>
<body>

<textarea class="form-control" rows="3" id = "md">321354164</textarea>

<div id="bc">41651</div>
<script>
    function md(){
var text = document.getElementById('md').innerHTML
        //window.alert(text);
        //{#var text  =  document.getElementById('mdbc').innerHTML;#}
        const xhr = new XMLHttpRequest()
        xhr.open("post", "/tool/md/")
        xhr.onreadystatechange = function(event) {
        if (xhr.status == 200) {
        const response = JSON.parse(xhr.responseText)
        console.log("服务器响应数据: ", response)
            document.getElementById("bc").innerHTML = response.html;

        }
        }

        const data = {
        md:document.getElementById('md').innerHTML,
        }
        // 请选择1、2、3的其中一种格式去请求
        // 1. json 格式请求

        // 2. urlencode请求
        xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded")
        const str = Object.keys(data)
        .map(key => {
        return `${key}=${encodeURIComponent(data[key])}`
        })
        .join("&")
        xhr.send(str)
    }

        //md()
    setInterval(md, 1000);
    // 3. form data 请求

</script>
</body>
</html>

将获取textarea的内容方式由innerHTML改为value即可:

var text = document.getElementById("md").value;
const data = {
      md: document.getElementById("md").value,
 };


```html

<textarea class="form-control" rows="3" id = "md" oninput="myOninput()"></textarea>
    <div id="bc">41651</div>
<script>
    function myOninput(){
        let value = document.getElementById("md").value // 输入值
        
        // 请求数据 response
        let response = `<h1>${value}</h1>`
        
         document.getElementById("bc").innerHTML = response // 回显
    }

  
</script>

```