是否有一个单一的HTML5 / CSS3兼容性测试,作为测试单个功能的替代方案



我得到了一个网站,如果浏览器不支持使用CSS 3和HTML 5构建的任何功能,我需要显示一个弹出窗口。唯一的问题是我不知道是否有一种包罗万象的方法可以检查浏览器是否无法解析某些内容,或者我是否需要使用 Modernizr 之类的东西并单独检查每个元素和功能?

如果有 catch all 方法来检查浏览器是否无法解析某些内容

解析运行在非常通用的规则上。未知元素被添加到 DOM 中。未知属性被添加到 DOM.CSS属性或无法识别的属性值将被忽略。与具有未知组件的 CSS 选择器关联的规则集将被忽略。对 JavaScript 属性的赋值是在没有特殊处理的情况下分配的。

关于你唯一可以捕获的东西(使用try / catch(是尝试调用不存在的函数,并尝试访问不存在的对象的属性。

所以,不,没有通用的解决方案。您需要单独测试可能导致严重故障的所有内容。

我不确定我是否正确理解了你的问题,但我想你在问是否有一个单一的测试来识别不支持任何HTML5/CSS3功能的浏览器(这样你就知道没有意义测试支持单个功能(。

简而言之:没有。

">

HTML5"和"CSS3"都是指松散的功能组,这些功能不是特别相关,除了它们不在HTML 4或CSS 2.1规范中。没有任何根属性或功能或东西可以检查来告诉您是否有任何HTML5/CSS3支持。它只是一系列单独存在或不存在的附加功能。

浏览器检测可能是您最好的选择。看看你网站的浏览器统计信息,看看最常见的浏览器不支持任何HTML5/CSS3功能(我会大胆猜测它会是IE8/7/6(。然后编写/获取(例如,从jQuery的已弃用的browser方法(对这些浏览器进行检测。

如果用户正在使用其中一个,请显示弹出窗口。如果没有,请在使用之前测试各个功能。

最终,不支持任何内容的旧浏览器将无法使用到足以发挥作用。

你的问题没有多大意义。 不,没有任何测试可以神奇地查看您网站中的每一段代码,并告诉您哪些代码在某些浏览器中不起作用,而无需您付出一些努力。

这就是像Modernizr这样的工具的全部意义 - 能够测试各种CSS3/HTML5功能以及正在使用的浏览器是否支持它们。 Modernizr 只是针对特定功能的一次性测试的集合,您可以根据需要测试任意数量或数量,并相应地使用 polyfill 等调整代码,以解决您使用的任何内容缺乏兼容性的问题。 除此之外,没有神奇的解决方案。

您需要在站点代码中识别旧版浏览器中可能不支持的所有 CSS3、HTML5 等功能,并使用 Modernizr 等工具来测试它们是否在客户端浏览器中工作,并使用这些测试结果来确定是否显示模态以及在其上放置什么。

最新更新