设置$(元素).style.backgroundColor,然后检查但不工作

Question

下面的代码有点困惑.

function DoColor() {
  document.getElementById("ID").style.backgroundColor = "#F4FFFF";

  alert("ID color = " + $("#ID").css("background-color"));
  // this shows RGB(244, 255, 255) 
  alert($("#ID").css("background-color") === "RGB(244, 255, 255)");
  // this show false   ?????

}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<input type="text" id="ID" onclick="DoColor()">

为什么没有true按预期发出警报？

Answer 1

您可以先使用js String.prototype.toLowerCase()转换为小写,然后比较:

function DoColor() {
  document.getElementById("ID").style.backgroundColor = "#F4FFFF";

  alert("ID color = " + $("#ID").css("background-color"));
  // this shows RGB(244, 255, 255) 
  alert($("#ID").css("background-color").toLowerCase() === "rgb(244, 255, 255)");

}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<input type="text" id="ID" onclick="DoColor()">