Javascript 彩色对比器

我正在寻找一种技术，在这种技术中，我们可以通过编程选择最佳的颜色对比度，以应用于不同（不可预测）背景颜色的HTML元素之上的文本

由于HTML元素将有不同的颜色，我们正在寻找一种技术，能够确定文本背后内容的颜色，然后调整文本的颜色以使用具有最佳对比度的颜色

我很确定这不可能只是CSS，我已经寻找了Jquery解决方案，但找不到任何。。。有人有线索吗

[更新]：

---

根据第一批答复，我想我需要重新措辞。想象一下，我正在建立一个图像共享服务，我想让人们自己在图片上贴标签。图片可以是任何颜色。如何为每张不同的图片选择正确的标签颜色。只要看一眼网站呈现的梯度，你就会立刻感到振奋。你得猜一猜，但只能猜20秒左右。这是一个解决此类问题的好网站，也是一个提供编程解决方案的好主意来源。而且不需要数学计算：只需为rgb VAL插入一些字节就可以了。

这是我最喜欢的两种颜色的对比度资源

W3C建议文本和文本背后背景之间的对比度至少为5:1

从页面：

---

上面显示的符合率是符合的最高符合率。WCAG 2.0 AA级和拟议的第508节刷新合规性级别的基础是，对于大小为18点（粗体为14点）或更大的文本，对比度为3:1；对于大小小于18点的文本，对比度为4.5:1。WCAG 2.0级别AAA合规性级别在文本小于18分时达到7:1，文本18分（粗体为14分）或更大时达到4.5:1。我认为这可能会为未来的研究人员节省一点时间，这对我来说非常有效。将红绿色和蓝色值插入函数，它输出“暗文本”或“亮文本”

---

使用@David答案中的一些代码。

只需一行就可以解决问题：

function getContrast50($hexcolor)
{ 
  return (hexdec($hexcolor) > 0xffffff/2) ? 'white':'black'; 
}

---

如果需要反转对比度，只需将白色与黑色切换即可。在php中。

CSS中现在有一个名为

混合模式的属性（目前刚刚在草稿中），可用于实现类似于您所需的内容

.contrasting-text {
    mix-blend-mode: difference;
}

CodePen有人将其放在一起演示：
+1以获取有用的资源，尽管我不确定它是否特别回答了这个问题！谢谢你的链接，但这并不是说我如何才能真正得到文本下的颜色！啊,对。我现在明白了，我跳到了前面。您必须使用Javascript、DHTML和DOM。在Javascript中，找到需要更改其文本颜色的对象；从该对象提取背景色属性；然后继续为标记文本选择颜色。这更接近你想要的答案吗？@Julien Genestoux——至于图像：就个人而言，我甚至从未想过尝试在照片中整合颜色，以产生一种复合背景色，与之相比，标签文本以对比色显示。相反，我总是在照片的顶部放一个白色的斑点，并在这个白色斑点上显示黑色标记文本。只是我的意见；毫无疑问，有一些很酷的算法可以很好地计算出平均背景色的近似值。胡特，就我个人而言，我不会尝试这样的事情。对不起，这并不能回答问题。是的，如果我能分辨出文本下的颜色就好了，但我不能。如何读取？您可以使用JavaScript:$（'.myclass'）.css（'background-color'）读取元素的当前背景色。使用该值，您可以计算任何其他颜色的对比度级别。我假设您想使用jQuery，因为您提到要查找它。2个问题：如何确定“myid”？如果它是一个图像呢？如果你的背景是一个图像，我不会尝试在客户端（使用画布）自动处理颜色-我会考虑服务器端解决方案，因为它会有较少的跨浏览器问题和更好的扩展。看看这个JQuery插件，它似乎实现了上述功能。小心（目前）插件没有迭代；您需要自己调用“each”，您可以尝试使用BackgroundCheck脚本：正如前面的评论所述，这是PHP代码，而不是Javascript。hexdec函数存在于PHP中，而不存在于JS中
.contrasting-text {
    mix-blend-mode: difference;
}