一段非常简单的js判断浏览器的内核
更新时间：2014年08月17日 16:29:51 投稿：hebedich
先说明，此处的方法是说超级简单的方法，不是指代码超级少，而是用非常简单的知识点，只要懂得怎么写JavaScript的行内样式就可以判断。
大家应该还记得JavaScript行内样式怎么写吧？（看来我是废话了！）
在前端开发过程中，有时我们需要判断浏览器的内核前缀，对不同的浏览器做出不同的处理，因此我们可以这么做。
alert(element.style.webkitTransition); 这个是获取以webkit为前缀的transition值。但如果不是webkit为前缀的浏览器，则会返回undefined。而我们可以将所有的内核前缀给枚举出来，然后获取其某个CSS的值，即可做出判断。代码如下：
function getVendorPrefix() {
// 使用body是为了避免在还需要传入元素
var body = document.body || document.documentElement,
style = body.style,
vendor = ['webkit', 'khtml', 'moz', 'ms', 'o'],
i = 0;
while (i < vendor.length) {
// 此处进行判断是否有对应的内核前缀
if (typeof style[vendor[i] + 'Transition'] === 'string') {
return vendor[i];
}
i++;
}
}
然后只需要调用getVendorPrefix()即可知道浏览器的内核前缀，如果返回undefined则证明浏览器不支持CSS3属性，即没有内核前缀。
大家应该知道，我们在写代码的过程中，能写CSS就不写JavaScritp，毕竟CSS的性能会比自己写JS的高一些，因此，我们在开发一些实际应该中，会用到transition，比如一个简单的图片轮播，我们可以使用CSS3的transition，也可以使用jQuery的animate或自己写原生，但CSS3的性能肯定会高一些，因此我们可以写两套代码，对于支持CSS3的浏览器则使用animation，而不支持的则使用计时器或animate。这样的话能够获取更好的用户体验。
以上是看jquery.slides.js的插件心得，如有更好的方法，请一定告知笔者。
相关文章
这篇文章主要介绍了javascript读取本地文件和目录方法详解,文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧2020-08-08
这篇文章主要介绍了JavaScript中Array对象用法,结合实例形式总结分析了Array数组对象的常用属性与方法的功能与相关使用技巧,需要的朋友可以参考下2016-11-11
在html页面中显示时间是很常见的，实现的方法有很多，下面为大家简单介绍两种方式，有需求的朋友可以参考下，希望对大家有所帮助2013-08-08
jquery ajax应用中iframe自适应高度问题解决方法
很多管理系统中，都使用iframe进行信息内容的展示方式，或者作为主菜单的链接展示内容。使用iframe的问题就是自适应高度的问题2014-04-04
在JavaScript中，null和undefined是两个常见的数据类型，本文就详细的介绍了JS中null和undefined的区别，感兴趣的可以了解一下2023-05-05
JavaScript使用DeviceOne开发实战（二） 生成调试安装包
这篇文章主要介绍了JavaScript使用DeviceOne开发实战（二） 生成调试安装包的相关资料,需要的朋友可以参考下2015-12-12
这篇文章主要为大家详细介绍了openlayers实现地图弹窗，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2020-09-09
这篇文章主要给大家介绍了关于利用JS实现一个同Excel表现的智能填充算法的相关资料，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧2018-08-08
bootstrapValidator 重新启用提交按钮的方法
bootstrapValidator 使用中，由于字段检查等原因，致使提交按钮失效。如何重新启用提交按钮呢？下面小编给大家介绍下bootstrapValidator 重新启用提交按钮的方法,需要的朋友可以参考下2017-02-02
用javascript实现一下所谓的动态渐变，考虑动态原因就不上图了，我来简单介绍下思路2014-05-05
最新评论