在jQuery的CSS模块源码中，有两个看起来不起眼的正则表达式：rmsPrefix和rdashAlpha。它们被定义在同一个位置，配合camelCase函数完成CSS属性名从连字符写法到驼峰写法的标准化转换。理解这两个正则的匹配边界和替换顺序，是搞清楚jQuery属性名处理逻辑的关键。
随后的camelCase函数源码非常简短，大致结构如下。它先定义两个正则对象，然后依次对传入的CSS属性名字符串执行两次replace。第一次replace用rmsPrefix处理以-ms-开头的厂商前缀，第二次replace用rdashAlpha把短横线加小写字母的组合转成大写字母。代码虽然短，但每一步都有明确的设计意图。
// jQuery源码片段
var rmsPrefix = /^-ms-/,
rdashAlpha = /-([a-z])/g;
function camelCase( string ) {
return string.replace( rmsPrefix, "ms-" ).replace( rdashAlpha, fcamelCase );
}
function fcamelCase( _all, letter ) {
return letter.toUpperCase();
}
注意这里第一次replace的替换值是字符串ms-，而不是直接处理成驼峰。这样做的目的不是立刻转驼峰，而是先把-ms-这个特殊前缀保护起来。后面的rdashAlpha才是真正负责短横线转驼峰的正则。如果没有rmsPrefix这一层处理，rdashAlpha会把-ms-中的m也当成短横线后的字母，最终生成MsTransform这样的错误结果。熟悉Microsoft CSS扩展的开发者都知道，msTransform才是正确的JavaScript属性名。
从代码设计角度看，jQuery选择用replace而不是手动遍历字符，是因为replace配合全局正则能够简洁地处理所有出现位置。同时，把替换逻辑拆成两个小正则，比写一个复杂的分支正则更容易阅读和维护。接下来分别分析这两个正则的具体作用。
一、rmsPrefix专为-ms-厂商前缀设计
rmsPrefix的完整定义是/^-ms-/。这个正则以^锚定字符串开头，只匹配最开始位置的-ms-片段。如果CSS属性名是-ms-transform，第一次replace会将其变成ms-transform。之所以需要这一步，是因为CSS中微软的扩展属性使用-ms-前缀，例如-ms-flex、-ms-grid、-ms-transform等。这些属性在JavaScript中的标准名称是msFlex、msGrid、msTransform。观察变化规律，短横线被去掉，前缀首字母m保持小写，后续单词首字母才大写。但通用的连字符转驼峰规则会把-ms-中的m也大写，变成MsFlex。这虽然在某些浏览器中也能访问，但不符合标准命名，且部分环境下可能读取不到。
jQuery通过先执行一次replace，把-ms-替换成ms-，相当于暂时去掉了短横线前面的横线，同时保留了m的小写。这一步之后，字符串变成ms-transform。这个字符串再交给rdashAlpha处理时，只会匹配到-transform中的-t，从而得到正确的msTransform。rmsPrefix的正则使用^锚定和固定的-ms-片段，既精确又高效，避免了全局扫描带来的额外开销。
可以做一个简单测试来对比两步与一步的区别：
// 模拟两个正则的处理过程
var rmsPrefix = /^-ms-/;
var rdashAlpha = /-([a-z])/g;
var input = "-ms-transform";
var step1 = input.replace(rmsPrefix, "ms-");
console.log(step1); // ms-transform
var step2 = step1.replace(rdashAlpha, function(match, letter) {
return letter.toUpperCase();
});
console.log(step2); // msTransform
如果注释掉step1，直接用rdashAlpha处理-ms-transform，得到的结果是MsTransform。下面的对比代码可以验证：
var input = "-ms-transform";
var wrongResult = input.replace(/-([a-z])/g, function(match, letter) {
return letter.toUpperCase();
});
console.log(wrongResult); // MsTransform
这种差异在jQuery的css方法中会直接影响属性名的读写。比如elem.style.msTransform和elem.style.MsTransform，前者是标准写法，后者能否工作取决于浏览器实现。所以rmsPrefix虽然只是一个很小的正则，却承担着兼容IE/Edge遗留属性的重要职责。
二、rdashAlpha负责连字符转驼峰
rdashAlpha的定义是/-([a-z])/g。g标志表示全局匹配，圆括号中的[a-z]是捕获组，用来提取短横线后面的第一个小写字母。replace回调函数fcamelCase接收两个参数：第一个参数是完整的匹配项，比如-t；第二个参数是捕获组内容，比如t。函数返回letter.toUpperCase()，即把该字母转成大写。
这个正则会匹配字符串中所有短横线后跟小写字母的位置，因此可以把border-radius、background-color、-webkit-transform等属性一次性转换成borderRadius、backgroundColor、WebkitTransform。由于g标志的存在，replace会遍历整个字符串，而不是只处理第一个匹配。这一点非常重要，因为CSS属性名中可能包含多个连字符，例如border-top-left-radius需要全部转换。
rdashAlpha的设计有一个细节：它只匹配短横线后的小写字母，不匹配数字，也不匹配另一个短横线。这意味着background-color-2这样的字符串会被转成backgroundColor-2，数字部分保持不变。这种限制实际是合理的，因为合法的CSS属性名中短横线后通常是字母，数字不会构成转换需求。另外，由于[a-z]不包含大写字母，如果输入字符串已有驼峰部分，也不会破坏原有大写字母。
通过replace回调，可以清晰地看到捕获组在字符串转换中的作用。相比手动split和join，这种写法简洁且效率更高。rdashAlpha和rmsPrefix的组合，也体现了jQuery源码中正则设计的克制：每个正则只处理一类边界情况，不追求用一个正则解决所有问题。
三、完整调用链路与兼容性思考
在实际调用中，camelCase不仅用于CSS属性名标准化，也用于data属性名、事件名等场景。比如jQuery.fn.css方法接收propertyName时会调用camelCase，data方法处理data-*属性时也有类似逻辑。理解这两个正则，可以看懂jQuery大量代码中的属性名转换环节。
从浏览器兼容性看，jQuery需要支持旧版IE和Edge的-ms-前缀属性。IE的style对象确实存在msFilter、msTransform等属性，而标准规范也要求以ms开头。如果没有rmsPrefix，开发者传入-ms-transform时，jQuery会错误地操作MsTransform属性，导致样式设置失败。这个兼容性漏洞曾出现在一些早期库中，jQuery通过一个四字符的正则就解决了。
除了-ms-，CSS还有-webkit-、-moz-、-o-等厂商前缀。它们的转换不需要特殊处理，因为WebkitTransform、MozTransform、OTransform这些在JavaScript中本来就以大写开头。rdashAlpha对-webkit-transform会得到WebkitTransform，符合预期。唯一需要特殊对待的就是-ms-前缀，因为它的首字母应该保持小写。这背后的原因与JavaScript标识符大小写规则以及浏览器厂商的历史实现有关。
总结起来，jQuery源码中rmsPrefix与rdashAlpha的配合，是一次经典的正则拆分设计。先保护特殊前缀，再执行通用转换，既保证了代码简洁，也消除了边界条件。阅读这段源码，不仅能理解CSS属性名在JavaScript中的映射规则，还能学到字符串转换过程中如何用最小代价处理特例。如果你在自己的工具库中需要做类似转换，直接沿用这种两段式replace思路，会比引入一个复杂正则或手写循环更可靠。
jQuery源码rmsPrefixrdashAlpha修改时间：2026-09-21 14:00:20