Question

只需学习nodejs。我想在发布时更改html中的内容，而不必完全呈现在页面中。

这是我当前的代码。

app.use(express.static('public'));
app.use(bodyParser.urlencoded({ extended: true }));
app.set('view engine', 'ejs')
var arr = [];

app.get('/', function (req, res) {
  res.render('index', {messages: null, error: null});
})

app.post('/user', function (req, res) {
        var input = req.body.userInput;
        var output = "";
        arr.push(input);
        for(var i = 0; i < arr.length;i++){
            (function(){
                console.log(arr[i]);
                output +=arr[i] + "</br>";
            })(i);
      }
      res.render('index', {messages: output, error: null});  
})


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

谢谢。任何建议都非常感谢。

Answer 1

您不能使用服务器端代码来做到这一点。

您可能必须编写客户端JavaScript才能操作现有页面的DOM。

该JS可以使用Ajax从服务器获取新数据。您可以编写客户端代码以提取所需的部分，也可以创建其他服务器端端点，该端点仅返回所需的数据位。

Answer 2

仅发送数据：

app.post('/user', function (req, res) {
        var input = req.body.userInput;
        var output = "";
        arr.push(input);
        for(var i = 0; i < arr.length;i++){
            (function(){
                console.log(arr[i]);
                output +=arr[i] + "</br>";
            })(i);
      }
      res.status(200).json({messages: output, error: null});//Not rendering new page, just sending data
})

在前端，如果您使用的是普通JS，请按以下步骤处理：

function handlePostUser() { // Invoke this on form-submit or wherever applicable
            var xhr = new XMLHttpRequest();
            xhr.open("POST", 'your link/user', true);
            xhr.setRequestHeader("Content-Type", "application/json");
            var payload = { data to post };
            xhr.send(payload);
            xhr.onreadystatechange = () => {
                if (xhr.readyState === 4 && !xhr.status) {
                    // Handle error
                    console.log("FAILED");
                } else if (xhr.readyState === 4 && xhr.status === 200) {
                    console.log("SUCCESS");
                    //your logic to update the page. No reloading will happen
                }
            }
}

在不渲染页面的情况下使用nodejs更改html内的内容

2 个答案: