Question

主要来自互联网的在线，node.js用户，当他们尝试实现或从节点注入数据时客户端（.html）正在使用jade框架，如果我没有使用jade框架，我需要使用普通的html，我需要在node.js中使用jQuery注入我自己的数据？比如，jquery的append（），html（）函数？下面是我的代码试图使用html更改客户端网站的HTML，控制台更新，但当我去我的网页，仍然显示旧文本'哟'而不是更新文本'新文本'。

var express = require("express");
var app = express();
var port = 3700;
var jsdom = require('jsdom')


app.get("/", function(req, res){
    var env = require('jsdom').env;

    env('./index.html', function (errors, window) {
        var $ = require('jquery')(window);
        console.log($('#header').text());
        $('#header').html('new-text');
        console.log($('#header').text());
    });

    res.sendfile('./index.html');

});

app.listen(port);

这是我正在使用的简单html

<!doctype html>
<html>
<body>
<title>Test</title>
<script type="text/javascript">
</script>
</body>
<h1 id="header">yo</h1>
<p id="paragraph">lorem</p>
</html>

Answer 1

问题中的代码没有按照您的想法行事，因为：

jsdom不会修改您的./index.html文件。
即使jsdom确实修改了您的文件，jsdom.env也是异步的，因此您仍然会在更改之前发送文件。

您可以做的是更改代码以发送您修改的DOM的序列化版本。以下代码更改了文本并将其提供给客户端：

env('./index.html', function (errors, window) {
    var $ = require('jquery')(window);
    $('#header').html('new-text');
    res.write($("html")[0].outerHTML);
    res.end();
});

请注意，上面的代码旨在说明解决方案的外观。它并不意味着在生产中按原样使用。

最后一点：使用jsdom和jQuery执行你正在做的任务对我来说似乎非常“沉重”。为了产生HTTP响应而设计用于动态生成模板的模板系统很可能比使用jsdom + jQuery更快。

使用Jquery从node.js向我的普通html文件注入数据，似乎不能在客户端工作，但我的控制台正在工作

1 个答案: