本文主要是介绍判断浏览器是否支持CSS3 已经初步探索JS 惰性加载,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!
分享一个判断浏览器是否支持的函数,然后有牵扯到了一个懒性加载的概念。
var iscss3=(function(){var _style=document.createElement("div").style;return 'transition' in _style||'mozTransition' in _style||'webkitTransition' in _style;})()
什么是惰性加载呢,像我们JS和CSS一样 很多浏览器属性和方法都不兼容,需要用到大量的分支来兼容。
比如说常用事件绑定:
function addEvent (type, element, fun) {if (element.addEventListener) {element.addEventListener(type, fun, false);}else if(element.attachEvent){element.attachEvent('on' + type, fun);}else{element['on' + type] = fun;}
}
每次我们运行它都要进行分支判断,这样针对性能来说就不高了。我们如果换成这样,以匿名函数的方式结合函数表达式。就懒惰了。
var addEvent = (function () {if (document.addEventListener) {return function (type, element, fun) {element.addEventListener(type, fun, false);}}else if (document.attachEvent) {return function (type, element, fun) {element.attachEvent('on' + type, fun);}}else {return function (type, element, fun) {element['on' + type] = fun;}}
})();
这样的话,只要执行一次,就会把正确的函数赋值给变量。
这篇关于判断浏览器是否支持CSS3 已经初步探索JS 惰性加载的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!