javascript - 与 CSS 属性名称的 jQuery.camelCase 相反

标签 javascript jquery css css-transitions camelcasing

jQuery.camelCase用于将虚线 CSS 属性转换为驼峰式 CSSOM(?或 DOM?)属性。

我想做相反的事情来动态创建 CSS 过渡值。

我不想使用 all为此的关键字。我想让不强制编码器只使用 background-color 成为可能而不是 backgroundColor .

这是否可能(可能通过 jQuery)或者是否需要大量代码来支持跨浏览器?

编辑:

$("#example").css("transition-property", "backgroundColor") // Fail

我不想做与示例中完全相同的事情,但这说明了问题。

我正在尝试遍历包含 css 属性和值的对象,以将对象键设置为转换属性。例如。 { backgroundColor: "red" }应该设置 background-color作为transition-property而不是 backgroundColor .

最佳答案

完成这项工作的一个简单函数是:

function deCase(s) {
    return s.replace(/[A-Z]/g, function(a) {return '-' + a.toLowerCase()});
}

alert(deCase('scrollbarDarkShadowColor')); // scrollbar-dark-shadow-color

可能还有许多其他方式。

此外,您还可以使用以下方法进行驼峰命名:

function camelCase(s) {
    return s.replace(/-(.)/g, function(a, $1){return $1.toUpperCase();});
}

关于javascript - 与 CSS 属性名称的 jQuery.camelCase 相反,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/16640527/

相关文章:

javascript - eslint - 如何知道规则在哪里 "defined"

javascript - 如何设置 foreach jQuery JSON CSV

php - 智能位置表单字段

jquery - 如何使移动设备的菜单从左侧出现

javascript - 'addEventListener`在幕后是如何工作的?

javascript - Lodash - 深入查找对象数组

javascript - 无法在插入的 iframe 中获取元素?

css - 背景图像故障

CSS 背景图片 - 正确用法是什么?

javascript - Magento 定制产品设计