如何从另一个HTML文件获取元素
我试图制作一个采用HTML文件中文本框的输入的node.js
应用程序。我想将这个值存储在一个数组中,尽管我不知道如何。我的总体目标是创建一个聊天应用程序,并且我认为有一些更简单的方法可以在不需要引用HTML文件的情况下获得输入。如何从另一个HTML文件获取元素
此外,有没有HTML文件的任何模板,因为我不是很熟练的HTML,使一个体面的网页。所以如果有一些我可以使用的模板,一切都会更好。
我的代码:
var events = require('events');
var express = require('express');
var http = require('http');
var app = express();
var msg = [];
app.get('/', function(req, res) {
res.sendFile(__dirname + '/index.html');
});
app.read('/', function() {
});
app.listen(3000, function() {
console.log("Server is running on port " + 3000);
});
#firstHead {
font-family: Georgia, 'Times New Roman', Times, serif;
}
<header>
<h1 id='firstHead'>
This is a header!
</h1>
</header>
<body>
<input type="text" id="inText" placeholder="Enter text here" />
</body>
帮助赞赏!
首先,你的HTML代码有很多错误。此版本正确的代码(你不会使用它,它只是给你的你做了什么错误的想法):
<!DOCTYPE html>
<html>
<head>
<style>
#firstHead {
font-family: Georgia, 'Times New Roman', Times, serif;
}
</style>
</head>
<body>
<h1 id='firstHead'>
\t This is a header!
\t </h1>
<form id="msg" method="GET" action="/msg">
<input type="text" name="msgContent" id="inText" placeholder="Enter text here" />
<input type="submit" value="Send">
</form>
</body>
</html>
现在这个HTML页面会发送输入内容到localhost:3000/msg
作为POST请求See here for more details,这里的问题是页面将被刷新或重定向(取决于你的实现,如果你想要SPA,你应该在这种情况下使用AJAX)。即使您使用AJAX,您也很难使用HTTP请求实现聊天应用程序。使用WebSocket协议来实现这个功能会更好。有一个名为Socket.io的模块可以帮助你很多。它有一个事件驱动的系统,因为它对实时应用程序非常棒,你可以查看他们的官方网站;他们有一个用几百行代码编写的聊天应用程序的例子。
现在让我们看一下你的服务器端代码,首先..有没有明确的方法称为read
,这里是你的代码的工作版本:
var express = require('express');
var http = require('http');
var app = express();
var msg = [];
app.get('/', function(req, res){
//You should use some template engines like EJS or Pug to render your HTML page with messages or the user will see nothing
res.sendFile(__dirname + '/index.html');
});
app.get('/msg', function(){
msg.push(req.query.msgContent);
res.redirect("/");
});
app.listen(3000, function(){
console.log("Server is running on port " + 3000);
});
将上面的代码按照原样工作,但是在客户端cuz中你没有看到任何东西(或者发送msg数组到客户端脚本来嵌入它)。我只是想让事情变得清晰,不会给你实现你的想法
我希望这对你有所帮助。
这也是不正确的,你在''中没有'
Ops,我没有注意到它:p –
标题应位于主体标记内 –
如果您想创建聊天应用程序,有更好的方法去解决它。查看https://socket.io/或类似的技术。 – jmargolisvt
好吧,我只是这样做,我只是不确定是否必须使用HTML创建文本框,感谢您的帮助! – LawlessWalrus