測試CSS顏色用JavaScript

-1

這是一個簡單的HTML/JavaScript文件：測試CSS顏色用JavaScript

<!doctype html> 
<html> 
<head> 
<meta charset="utf-8"> 
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> 

<title>Javascript</title> 
<script type="text/javascript" src="jquery.min.js"></script> 
<style> 
.red { 
    color:rgb(255,0,0); 
} 
</style> 
</head> 
<body> 
    <p class="red">The quick brown fox jumped over the lazy developer.</p> 

    <script type="text/javascript"> 
    $("p").each (function (index,element) { 
     var color = $(element).css("color"); 
     alert("color=" + color); //the alert says color=rgb(255,0,0) 
     if (color==rgb(255,0,0)) { 
      alert("color is rgb(255,0,0)"); 
      //this alert never fires and the code never gets here. 
      $(element).css("color","#000000"); 
      $(element).css("background-color","#ffff00"); 
     } 
    }); 
</script> 
</body> 
</html>

爲什麼測試if (color==rgb(255,0,0)失敗？是不是顏色rgb(255,0,0)？如果測試表示color="red"，似乎也無關緊要。

來源

2016-07-07 Ron

該代碼可以讓你回來爲元素的「色」的CSS屬性設置的實際值。所以如果你通過一個類設置顏色，你將無法得到你期望的顏色值 – daf

嘗試添加引號：'color ==「rgb（255,0,0）」' – j08691

對.css("color")的調用返回一個字符串，因此您必須將其與字符串進行比較。此外，由於您正在進行字符串比較，因此空格很重要：rgb(255,0,0) !== rgb(255, 0, 0)。

這只是正常：

$('document').ready(function() { 
 

 
    $("p").each(function(index, element) { 
 
    var color = $(element).css("color"); 
 
    alert('color=' + color); 
 
    if (color == 'rgb(255, 0, 0)') { 
 
     alert("color is rgb(255,0,0)"); 
 

 
     $(element).css("color", "#000000"); 
 
     $(element).css("background-color", "#ffff00"); 
 
    } 
 
    }); 
 

 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 

 
<style> 
 
    .red { 
 
    color: rgb(255, 0, 0); 
 
    } 
 
</style> 
 

 
<p class="red">The quick brown fox jumped over the lazy developer.</p>

來源

2016-07-07 18:00:43 Timo

你的解決方案奏效了。它甚至在.red的定義中是有效的：它是顏色：＃FF0000; – Ron

測試CSS顏色用JavaScript

回答

相關問題