Arduino and JS/Cpp

Arduino and JS/Cpp

本文关键字：Cpp JS and Arduino      更新时间：2023-10-16

我有一个项目"智能家居"，我使用带有以太网盾的Arduino Mega。我的问题是将数据从arduino连接到GUI网站(我是JS的初学者(。当我按下按钮时，数据被发送到Arduino，我的按钮颜色从红色变为绿色(亮起(->这没关系。

然后，如果我打开门，我想将颜色从红色变为绿色，我不知道如何。

这是Arduino代码：

int count;                 // used by 'for' loops
int sw_arr[] = {30,31,32,33,34,35};  // pins interfaced to switches
for (count = 0; count < 5; count++) {
    cl.print("<switch>");
    if (digitalRead(sw_arr[count])) {;
        cl.print("OFF");
    }
    else {
        cl.print("ON");
    }
    cl.println("</switch>");
}

在我的网站上，字符串从 OFF 更改为 ON，但我想更改背景颜色，我认为我的问题是 Javascript。

这是教程中的原始代码：

var count;
var num_an = this.responseXML.getElementsByTagName('switch').length;
        for (count = 0; count < num_an; count++) {
             document.getElementsByClassName("doors")[count].innerHTML =
             this.responseXML.getElementsByTagName('switch')[count].childNodes[0].nodeValue;
        }

我更改了此代码，但仍然不起作用：

var count;
var num_an = this.responseXML.getElementsByTagName('switch').length;
for (count = 0; count < num_an; count++) {
if(this.responseXML.getElementsByTagName('switch')[count].childNodes[0].nodeValue === "ON") {
                $('.doors').css('background', '#989898');
            }
        else {
                $('.doors').css('background', '#FA6900');
             }
        }

网页代码：

<div class="item-door light-red doors">
        <div id = "door">  
           <i class="fa fa-key"></i>
              <p>Door</p>
        </div>
 </div>

所以总结，我需要将 DIV 背景颜色从红色更改为绿色，而不是字符串开/关。

如果有人有时间可以帮助我，我将不胜感激！

代码$('.doors').css('background', '#989898');更改包含类"门"的所有容器的背景。在 for 语句中，如果最后一次迭代更改了 #FA6900 的背景，则所有div 都将获得#FA6900颜色。

如果你只想改变一个容器，你必须写：

$( $(".doors").get(count) ).css('background', '#989898') ."

有两个时间$()，因为.get()返回一个 DOM 元素而不是一个 jquery 元素，所以如果我们想应用 .css() 方法，我们需要再次转换它。

最后一点：#989898是灰色的，#FA6900是橙色的

相关文章：