不管我们有多讨厌浏览器类型前缀，我们每天都要面对它，否则，有些事情将无法正常工作。这些前缀有两种用法：在CSS中(如“-moz-”)和在JS中。有一个非常精彩的X-Tag项目，里面有一个非常巧妙的JavaScript脚本，可以用来判断当前使用的是什么前缀——。让我演示一下它是如何工作的！

例如，CSS前缀在IE中是“-ms-”，在老Opera中是“-o-”，在Firefox中是“-moz-”，在Safari/Chrome中是“-webkit-”。JavaScript判断它们的方法有很多。

方法一：特征判断。

//取浏览器的CSS前缀var prefix=function(){ var div=document . create element(' div ')；var CSS text='-web kit-transit : all . 1s；-moz-transit : all . 1s；-o-transit : all . 1s；-ms-transit : all . 1s；transition:all .1s'；div . style . CSS text=CSS text；var style=div.styleif(style . webkittransition){ return '-WebKit-'；} if (style。moztalk){ return '-moz-'；} if(style . otransition){ return '-o-'；} if(style . mstransition){ return '-ms-'；}返回“”；}();通过创建div，将前缀css样式-webkit-、-moz-、-o-、-ms-添加到其中，然后获取样式，并通过style.xxxTransition判断它是哪个前缀。

方法2: getcomputedstyle获取documentElement的所有样式并解析它们。

先通过window.getComputedStyle获取样式，将样式变成数组。

var style=window . getcomputedstyle(document . document element，' ')；var arr=[]. slice . call(styles)；console . log(arr)；Firefox arr如下。

Chrome arr如下。

您可以看到，您用自己的浏览器获得了CSS前缀名称。

将所有属性连接成一个字符串，然后用正则表达式匹配它们以找到前缀。

//取浏览器的CSS前缀var prefix=function(){ var styles=window . getcomputed style(document . document element ' ')；var core=(Array.prototype.slice。调用(样式)。连接(“”)。匹配(/-(moz|webkit|ms)-/) ||(样式。OLink==='' [' '，' o '])[1]；返回'-'核心'-'；}();我们看到方法2的代码比方法1少得多。方法1和方法2都使用匿名函数，在一次执行后返回结果，所以不需要每次判断都调用函数。

以上内容是如何通过边肖介绍的JavaScript用两种方式判断CSS浏览器类型前缀。希望大家喜欢。