Javascript 供应商前缀中的上驼峰大小写与下驼峰大小写

Javascript 供应商前缀中的上驼峰大小写与下驼峰大小写,javascript,html,css,webkit,vendor-prefix,Javascript,Html,Css,Webkit,Vendor Prefix,以下两项似乎都在发挥作用: element.style.WebkitFlex = 1; element.style.webkitFlex = 1; 但哪种语法是标准的?因为这与样式属性有关,所以我们应该使用已建立的驼峰大小写表示法,用于CSS属性 所有与样式相关的特性的命名如下所示: 字体变体 线高 字母间距 字距 文本对齐 因此,我们应该坚持既定的做法。首先 element.style.WebkitFlex = 1; 是首选语法。在使用非规范化的、精确的CSS属性名称时,我们必须使用括号表

以下两项似乎都在发挥作用:

element.style.WebkitFlex = 1;
element.style.webkitFlex = 1;

但哪种语法是标准的?

因为这与样式属性有关,所以我们应该使用已建立的驼峰大小写表示法,用于CSS属性

所有与样式相关的特性的命名如下所示:

字体变体 线高 字母间距 字距 文本对齐

因此,我们应该坚持既定的做法。

首先

element.style.WebkitFlex = 1;
是首选语法。在使用非规范化的、精确的CSS属性名称时,我们必须使用括号表示法:

element.style['-webkit-flex'] = 1;
不幸的是,这相当笨拙。点表示法为这些情况提供了更好的支持,正是出于这种精神,我们还能够使用其camelCased对应项引用供应商前缀属性

在CSS和JavaScript之间规范化属性名称的过程中,破折号被识别为分隔符。很明显,它们在生成的camelCased属性名称中被完全解析出来,但仍然被考虑在内。特别是,(定界)破折号指示在何处应用不同的大小写(即大写字母)。而且,即使它们不是字母字符,破折号在(大多数)供应商前缀CSS属性中占据第一位,这意味着特定供应商的名称前缀变成大写。还解释了该过程

因此,
element.style['-webkit-flex']=1变成

element.style.WebkitFlex = 1;
类似的规则适用于其他供应商,因此我们也可以

element.style.MozTransition = 'width 1s 0s ease-in-out';

element.style.OTransform = 'scaleX(1.5)';
如前所述,此规范化过程在某些库中应用,其中包括


这类过程的进一步证据可以在规范的其他部分中看到。例如,如何解析数据属性的定义。

谢谢,但它没有回答我的问题。@Hermes-我假设您正在寻找命名约定的最佳实践。我将强调您所说的,因为它让我感到困惑:“…此规范化过程在某些库中应用,包括jQuery等。“我以前从未见过或听说过。请注意,这个问题已经有3年了。@Rob字符串操作是永恒的。这里是这种规范化的一个实例,尽管在本例中使用了
-ms-*
供应商前缀。是的,但问题被标记为javascript,而这些东西就是jQuery,我甚至在谷歌上都找不到。