javascript - 封装函数，实现游览器兼容。
问题描述
<!doctype html><html lang='en'><head> <meta charset='UTF-8'> <title>封装获取css属性</title> <style>h1{ width:300px; height:100px; background-color:red;} </style></head><body> <h1>我是高100px，宽300px的红色长方形</h1> <script type='text/javascript'>var h1 = document.getElementsByTagName(’h1’)[0];//标准浏览器console.log( window.getComputedStyle(h1)[’width’]);console.log( window.getComputedStyle(h1).height);//IE浏览器console.log(h1.currentStyle.width);console.log(h1.currentStyle.height);//封装函数//ele表示元素，zxc表示属性functiong abc (ele,zxc){ //第一种 var qwe = window.getComputedStyle( ele ).zxc||ele.current.zxc console.log(qwe); //第二种 if (window.getComputedStyle( ele )){window.getComputedStyle( ele ).zxc }else{ele.current.zxc }} </script></body></html>
这样封装对不对？
问题解答
回答1：你要先判断函数存不存在
function getStyle(elem, attr) { let style; if (window.getComputedStyle) { // 标准// 防止 elem === documentlet view = (elem.ownerDocument || elem).defaultView;if (!view || !view.opener) { view = window;}style = window.getComputedStyle(elem)[attr]; } else if (document.documentElement.currentStyle) { // IEstyle = elem.currentStyle[attr]; } elem = null; return style;}
网公网安备