JS自动添加适配浏览器样式前缀的方法

const styleTest = document. createElement( 'div'). style

const render = {

webkit: 'webkitTransform',

ms: 'msTransform',

Moz: 'MozTransform',

O: 'OTransform',

standard: 'transform'

}

const getPrefix = (() => {

for ( let key in render) {

if ( styleTest[ render[ key]] !== undefined) {

return key

}

}

})()

export default function stylePrefix ( style) {

if ( getPrefix === 'standard') {

return style

}

return getPrefix + style. charAt( 0). toUpperCase() + style. substr( 1)

}

在vue-cli中直接写样式表，vue可以自动帮助添加浏览器前缀，但有时候需要通过js动态添加样式，就需要考虑浏览器兼容问题，可利用此方法自动添加浏览器前缀。