更改 html 上 LED 的颜色答案

【问题标题】：Change the color of a led on html更改 html 上 LED 的颜色
【发布时间】：2020-04-23 19:25:56
【问题描述】：

我将根据是否有互联网连接来更改 LED 的颜色。这是我到目前为止所做的：

style.css

.led-green {
  position: relative;
  right: -50% ;
  top: 10%;
  margin: 0 auto;
  width: 24px;
  height: 24px;
  background-color: #ABFF00;

}
.led-red {
  position: relative;
  right: -50% ;
  top: 10%;
  margin: 0 auto;
  width: 24px;
  height: 24px;
  background-color: rgb(255, 0, 0);

}

app.js

 /** Check if internet connection is avaiable */
  var  internetConnection =""
  require('dns').resolve('www.google.com', function(err) {
    if (err) {
       console.log("No internet connection");
       internetConnection ="led-red";
    } else {
       console.log("Connected to internet ");
       internetConnection ="led-green";

    }

    console.log(internetConnection)
  });

我想这是我遇到问题的部分

index.ejs

  <div class="<%=internetConnection%>"> </div>

我希望通过启动应用程序，部门将设置为：

<div class ="led-green"> </div>

或

<div class ="led-red"> </div>

知道如何解决这个问题吗？

提前致谢！

更新

我是render函数中的变量如下：

.......................
 res.render('index', {
.....
internetConnection:internetConnection,
...............
}

更新

问题不在于渲染。问题是当我如下定义 div 时 html 页面不起作用：

知道如何解决这个问题吗？再次感谢任何提示！

【问题讨论】：

你用的是快递吗？
@MEDZ 是的，我也在使用它
所以你把这个变量传递给.render()函数？在寻找解决方案之前，我只需要查看全貌。
@MEDZ 是的，我已经稍微更新了代码，让图片更清晰！感谢您的支持！

标签： html css node.js ejs

【解决方案1】：

是否有可能在您的应用决定互联网连接是否可用之前呈现您的响应？在我看来，这是您面临的一个问题，因为 nodejs 是异步的。

尝试将用于向客户端发送响应的代码放在 dns.resolve() 回调中，例如：

 var  internetConnection =""
  require('dns').resolve('www.google.com', function(err) {
    if (err) {
       console.log("No internet connection");
       internetConnection ="led-red";
       ejs.render(errorHTMLString, data, options);
    } else {
       console.log("Connected to internet ");
       internetConnection ="led-green";
       ejs.render(noErrorHTMLString, data, options);
    }


  });

希望这会有所帮助。

【讨论】：

【解决方案2】：

请确保在resolve()的回调中调用render()函数：

  var  internetConnection =""
  require('dns').resolve('www.google.com', function(err) {
    if (err) {
       console.log("No internet connection");
       internetConnection ="led-red";
    } else {
       console.log("Connected to internet ");
       internetConnection ="led-green";

    }

    console.log(internetConnection);
    res.render('index', {
      internetConnection:internetConnection,
    }
  });

【讨论】：