我正在尝试让我的网站在高对比度模式下易于访问。为了检测何时启用高对比度模式，我创建了一个 JavaScript 方法来检测背景图像是否被禁用，因为高对比度模式会禁用背景图像。然后如果浏览器处于高对比度模式，我会附加一个 CSS 文件来修复以高对比度显示。这在 Firefox、Edge 和 IE 中运行良好，但 Chrome 使用自己的扩展来创建高对比度，并且它不会禁用背景图像，因此在 Chrome 中没有附加用于高对比度的 CSS。
通过搜索，我发现 Chrome 在网站上添加了一个过滤器，而不是启用/禁用/更改网站颜色或图像本身。我找了又找，但找不到任何可测试的内容来检查 Chrome 是否使用高对比度模式。如果有一种方法可以检测正在使用哪些扩展，那也可以解决问题，但我也没能找到一种方法来做到这一点。
我的代码实际上运行良好，我所需要的只是能够检测 Chrome 中的高对比度模式。这是我用来检查高对比度模式的方法。
let highContrast = (options) => {
let hcDetect = jQuery(`<div id="jQHighContrastDetect"></div>`).css('background', 'url(../uploads/c-wht-small.png)');
hcDetect.appendTo(document.body);
if (hcDetect.css('background-image') === 'none') {
$('head').append('<link rel="stylesheet" href="../css/highcontrast.min.css" type="text/css" media="all">');
}
}最佳答案
如果您询问的是 Windows 高对比度模式，Chrome 并不知道它何时处于事件状态。
一般来说，如果 Windows 用户选择启用高对比度模式，则该用户正在 Microsoft Internet Explorer 或 Microsoft Edge 中冲浪(因为这些浏览器支持)。它们都支持专有的 -ms-high-contrast @media规则。
检查丢失的背景图像是一种可以在 IE/Edge 中使用的策略，但使用媒体查询是更好的方法。特别是因为 Windows High Contrast Mode will soon allow background images in Edge .
如果您希望检测特定扩展程序何时在 Chrome 中设置了自己的高对比度模式，了解是哪个扩展程序会很有帮助。
例如，使用 High Contrast您可以在 <html> 上查找以下属性。标签:hc="a3"和 hcx="3" (您的值可能不同，但属性应该匹配)。如果你打开浏览器开发工具，你可以看到它做的一些其他事情。但这些属性位于 DOM 的最高级别，使用起来可能是最安全的。
如果您询问的是 Android 版 Chrome，那也是一个不同的过程。
关于javascript - 在 Chrome 浏览器中检测高对比度扩展程序的使用，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/38492220/