Arduino和JS / Cpp

Question

我有一個項目“ smart house”，並且我將Arduino Mega與Ethernet Shield一起使用。 我的問題是將數據從arduino連接到GUI網站（我是JS的初學者）。 當我按下按鈕時，數據將發送到Arduino，並且我的按鈕的顏色從紅色變為綠色（點亮）->可以。

然后，如果我打開門，我想將div的顏色從紅色變為綠色，我不知道該怎么做。

這是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');
             }

        }

HTML代碼：

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

因此，總之，我需要將DIV背景顏色從紅色更改為綠色，而不是字符串ON / OFF。

如果有人有時間可以幫助我，我將非常感激！

Answer 1

代碼$('.doors').css('background', '#989898'); 更改所有包含“門”類的容器的背景。 在for語句中，如果最后一次迭代更改了#FA6900背景，則所有div都將獲得#FA6900顏色。

如果只想更改一個容器，則必須編寫：

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

$()有兩次，因為.get()返回DOM元素而不是jquery元素，因此如果要應用.css()方法，則需要再次對其進行轉換。

最后一點： #989898為灰色， #FA6900為橙色