javascript - 问个奇怪的问题，怎样知道页面上的文字的字体

Question

比如字体设置的是：

font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif, 'Microsoft Yahei';

但是在不同的系统下，字体显示的不一样，怎样知道当前眼睛看到的是哪种字体，因为我实在对字体不太感冒→_→
同事告诉我拿控制台一个一个删，这也是个办法，不知道各位知道可否从编程角度解决，比如js?

Answer 1

如果是 Chrome 的话，哪儿需要插件啊，看下图：

注意右下角。

Answer 2

chrome 鼠标移动到要查看字体的地方，按F12或审查元素
选择 computed 然后滚轮往下移动 你会看到

Answer 3

Chrome 下安装这个扩展插件《whatfont》

开启后，鼠标指针划到字体处，会自动展示出来是哪种字体，如图：

抱歉，昨天晚上工作太忙没能及时补充内容。

当使用了这个插件后，点击某一个字体时，它可以把CSS定义font-family全部展示出来，而且还可以显示font-size字号、line-height行高、字体color属性值。

起初这个工具是推荐给我们的设计师使用，对于不懂开发又想一眼看出页面是什么字体时，使用起来还是很方便的。

不过， @Humphry 提到这个插件对字体识别是有错误，该网页使用的字体并不是helvetica，而是open sans字体，但是此插件显示的"Open Sans","Helvetica Neue"是失效的。

因为我对Open Sans字体并不了解，所以关于这个问题我想请教SF的开发者 @joyqi ，对于字体这一块是如何设计与定义的，什么情况下字体会应用"Open Sans"，什么情况下字体会应用helvetica。