/**
*浏览器兼容写法封装
*/
let elementStyle = document.createElement('div'
).style
let vendor = (() =>
{
let transformNames =
{
webkit: 'webkitTransform'
,
Moz: 'MozTransform'
,
O: 'OTransform'
,
ms: 'msTransform'
,
standard: 'transform'
}
for (let key
in transformNames) {
if (elementStyle[transformNames[key]] !==
undefined) {
return key
}
}
return false
})()
export function prefixStyle(style) {
if (vendor ===
false) {
return false
}
if (vendor === 'standard'
) {
return style
}
return vendor style.charAt(0).toUpperCase() style.substr(1
)
}
//调用
const transform = prefixStyle('transform') const backdrop = prefixStyle('backdrop-filter')
div.style[transform] = `translate3d(0,0,0)` 等同于 div.style['transform'] = `translate3d(0,0,0)`
div.style[backdrop] = `blur(4px)`等同于 div.style['backdrop'] = `blur(4px)`
更多专业前端知识,请上
【猿2048】www.mk2048.com