我可以依靠元素的颜色吗?

时间:2016-09-24 02:18:05

标签: javascript jquery css browser colors

我的代码中有很多这样的条件:(基于元素颜色的条件)

if ( $(elmnt).css("color") == "rgb(134, 134, 134)" ) {
    // do stuff
}

最近我听说过:

  

依赖颜色的元素是错误的。因为不同的浏览器返回不同种类的颜色。像:

     
      
  • rgb (0,0,0)
  •   
  • #000000
  •   
  • black
  •   

这是真的吗?无论如何,正如我所说,我的JS代码中有很多条件,现在我不知道该怎么做。有什么建议吗?

注意:在我的代码中更改所有这些条件似乎是一场噩梦。 :-(

2 个答案:

答案 0 :(得分:4)

您可以将此RGB颜色解析器用于JavaScript:

http://www.phpied.com/rgb-color-parser-in-javascript/

使用示例(来自网站):

var color = new RGBColor('darkblue');
if (color.ok) { // 'ok' is true when the parsing was a success
    // alert channels
    alert(color.r + ', ' + color.g + ', ' + color.b);
    // alert HEX and RGB
    alert(color.toHex());
    alert(color.toRGB());
}

答案 1 :(得分:-1)

我不会依赖任何基于UI的值,特别是如果它是一个您希望保持无bug的重要项目。使用诸如颜色之类的CSS值也会使您的应用程序在将来容易出错,因为如果引入具有您正在检查的某些属性的元素,则检查可能会失败。

您还可能依赖于颜色,因此如果颜色不能满足您的需求并且需要更改它,您还必须更改颜色检查代码。

对于他们如何返回元素的颜色属性,可能存在浏览器,特别是JavaScript库的差异,因此,如果您决定采用这种颜色检查方式,则需要采取这些差异也被考虑在内,这不一定比改变你目前害怕不得不重写的所有代码更快。

使用UI状态检查某些内容,无论重要与否,也有点愚蠢 - 请考虑以下情况:

您正在开发一个在线书店,用户可以在其中选择书籍到购物篮然后购买。在购买之前,用户必须通过将一些金额从他们的银行帐户转移到他们的书店帐户来填写他们的书店帐户余额。

退房时,有一个很大的"退房"按钮,仅当用户在其书店帐户上有足够的钱时才可见,否则它是不可见的。

每次按下该按钮,它都会调用一个功能getBooks(),该功能会将用户重定向到一个页面,上面写着#34;这些书正在路上!"并通知你有人买了一些书,你需要开始包装和发布书籍。

现在,这里有什么问题?显然,如果用户在他们的书店帐户上没有足够的钱,用户就无法按下按钮,因为按钮是不可见的...但是如果用户比这更聪明,那么检查结果一段时间的页面,并注意他/她只需要调用getBooks()函数来获取书籍,无论他/她是否有他/她的书店帐户上的钱,因为你只是依靠不显示如果用户的帐户中没有钱,则按钮。

这是一个很大的问题,我实际上并不知道这种编程失败的官方名称,但它被称为" UI阻止","动作阻塞UI"或"通过UI"安全。它通常发生在MMO游戏中的供应商NPC中 - 您点击供应商并弹出一个窗口,您可以从中购买物品,而您没有钱的物品的所有购买按钮都会被禁用并显示为灰色。你的游戏资金并不总是在服务器端进行检查,因此你可以随便购买所有物品,无论你是否有钱,如果你只知道哪个购买按钮的功能可以打电话,因为你不能按按钮本身。