Question

我是一个初学者，我想要的是只需点击一个按钮就可以在浏览器中加载一个全新的页面。我尝试了一些东西，但是没有用。这是代码。

NodeJS文件：

var http = require('http');
var fs= require('fs');


var htmlHome = "";
var htmlDemo = "";


htmlHome = fs.readFileSync("index.html");
htmlDemo = fs.readFileSync("demo.html");

//console.log(htmlHome.toString());

function onRequest(request, response)
{
    console.log("A user made a request" + request.url);
  if(request.url === "/")
  {
    response.writeHead(200, {"Context-Type": "text/plain"});
    response.write(htmlHome);
    response.end();
  }
  else if(request.url === "/demo.html")
  {
    console.log("DEMO")
    response.writeHead(200, {"Context-Type": "text/plain"});
    response.write(htmlDemo);
    response.end();    
  }
}

http.createServer(onRequest).listen(80);
console.log("Server is running...")

这是在开头加载的文件index.html：

<!DOCTYPE html>
<html>
<body>
<h2>Using the XMLHttpRequest Object</h2>
<div id="demo">
<button type="button" onclick="loadXMLDoc()">Change Content</button>
</div>
<script>
function loadXMLDoc() {
  var xhttp = new XMLHttpRequest();
  xhttp.open("GET", "demo.html", true);
  xhttp.send();
}
</script>
</body>
</html>

这是我按下按钮时要加载的demo.html：

<!DOCTYPE html>
<html>
<body>
<h2>This is demo file!/h2>
</body>
</html>

除了按下按钮之外，Everythings工作除了新页面没有出现。如何点击按钮时要加载demo.html页面？

Answer 1

如果您只想打开一个新的浏览器页面，它将只是客户端的window.open。

但是如果你想在不重新加载页面的情况下获取内容，你不仅要发送请求，还要接收它的响应，并在页面上呈现它的正确部分。

Answer 2

你可以尝试一种更简单的方法。而不是

<button type="button" onclick="loadXMLDoc()">Change Content</button>

只需使用超链接：

<a href='demo.html'>Change Content</a>

这将使用浏览器构建导航功能。

如何使用nodeJS在浏览器中加载新页面

2 个答案: