首页 > 解决方案 > 如何将javascript控制台输出显示到alert()中

问题描述

我的老师每天都在互联网上为我们寻找随机的事实,然后她在黑板上写字,我们每天上她的课都能看到。我正在尝试制作一个超级简单的网站,一旦单击按钮,页面顶部就会出现警报。每当我无法弄清楚如何使控制台进入警报时。我查看了另一个不同的 Stack 问题,但我并没有真正理解它。这是我的完整代码。对不起,我刚开始使用 javascript,对它来说简直是再熟悉不过了。提前致谢!

const express = require("express");
const app = express();
app.use(express.static("public"));
app.get("/", (request, response) => {
  response.sendFile(__dirname + "/facts.html");
});
const listener = app.listen(process.env.PORT, () => {
  console.log("Your app is listening on port " + listener.address().port);
});

var fact = require('random-fact');
fact();
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>Generate Random Facts</title>
</head>
<body>
<h1>Fact Generator</h1>
<br><br><br><br>
<script>

function test() {
    alert('fact');
}

</script>
<input type="button" onclick="test()" value="Generate Random Fact!">
</body>
</html>

标签: javascripthtmlrandomconsole

解决方案


如果我没有正确理解您的代码,我很抱歉,但根据我对第一个代码块的理解,NodeJS 正在根 url 上发送一个文件。那个根文件就是你想要提醒这个“随机事实”的东西

但是,随机事实数据存储在var fact = require("random-fact")

NodeJS 是一个 JavaScript 运行时环境。意思是在浏览器之外和服务器中执行 JavaScript 代码的地方。NodeJS 不像普通 JS,您可以访问 BOM 和 DOM。

但是,使用 express 您可以设置所谓的端点。该端点会将每个请求的数据发送到您可以在前端设置的每个路由。

首先,我假设该fact()函数返回一些数据。我们将设置一个端点:

app.get('/random-facts', (req, res) => res.send(fact()));

每当我们向它发送 get 请求时,/random-facts它都会执行该函数并希望得到你想要的

在前端,我们需要执行所谓的 AJAX 请求。您向 API 发送请求的位置。就像您在浏览器中键入时所做的一样,您www.google.com会发送一个获取请求。AJAX 请求可以通过请求变得更加复杂,GET但那是为了别的。

我们将通过 JS 使用fetch API来做到这一点

在你的 html 上你可以做

<script>
fetch('http://localhost:3000/random-facts')
  .then(response => response.json())
  .then(data => alert(data));
</script>

这可能比您所知道的要先进一些,但我希望这会有所帮助


推荐阅读