网络知识 娱乐 碎片时间学编程「108]:基于当前浏览器为 CSS 属性添加前缀

碎片时间学编程「108]:基于当前浏览器为 CSS 属性添加前缀

基于当前浏览器为 CSS 属性添加前缀。

使用Array.prototype.findIndex()前缀字符串数组来测试是否在Document.body 的CSSStyleDeclaration对象中定义了其中一个浏览器厂商,否则返回null。

使用String.prototype.charAt()和String.prototype.toUpperCase()将该属性大写,该属性将附加到浏览器厂商前缀字符串中。

JavaScript

const prefix = prop => {const capitalizedProp = prop.charAt(0).toUpperCase() + prop.slice(1);const prefixes = ['', 'webkit', 'moz', 'ms', 'o'];const i = prefixes.findIndex(prefix =>typeof document.body.style[prefix ? prefix + capitalizedProp : prop] !=='undefined');return i !== -1 ? (i === 0 ? prop : prefixes[i] + capitalizedProp) : null;};

示例

prefix('appearance');// 支持浏览器“外观”,具体值为“webkitAppearance”、“mozAppearance”、“msAppearance”或“oAppearance”

更多内容请访问我的网站:https://www.icoderoad.com