在 JavaScript 中更改浏览器特定的 CSS3(前缀)属性
所以我试图用javascript动态改变div的样式,这通常没什么大不了的,除了我试图改变一些有前缀的CSS3属性,即名称中的减号(-)...和当然,这意味着完全在 javascript 中的其他东西...
所以我在我的 javascript 中进行了这种操作:
r += 1;
document.getElementById('someDiv').style.transform = "rotate(" + r + "deg)";
并且我的 div 的 style 属性如下所示:
transform: rotate(30deg);
-ms-transform: rotate(30deg); /* IE 9 */
-webkit-transform: rotate(50deg); /* Safari and Chrome */
-o-transform: rotate(30deg); /* Opera */
-moz-transform: rotate(30deg); /* Firefox */
这样 javascript 就可以很好地更改“transform”属性,但是如何我改变其余的?因为这样做是行不通的:
document.getElementById('someDiv').style.-ms-transform = "rotate(" + r + "deg)";
因为 JavaScript 将“-”读取为语法错误:(
想法?
So I'm trying to dynamically change the style of a div with javascript, which is normally no big deal except that I'm trying to change some CSS3 properties which have a prefix, i.e. minus (-) in the name... and of course, that means something else entirely in javascript...
so I've got this going on in my javascript:
r += 1;
document.getElementById('someDiv').style.transform = "rotate(" + r + "deg)";
and my div's style property looks like this:
transform: rotate(30deg);
-ms-transform: rotate(30deg); /* IE 9 */
-webkit-transform: rotate(50deg); /* Safari and Chrome */
-o-transform: rotate(30deg); /* Opera */
-moz-transform: rotate(30deg); /* Firefox */
so that javascript works fine to change the "transform" property, but how would I change the rest of them? because doing something like this won't work:
document.getElementById('someDiv').style.-ms-transform = "rotate(" + r + "deg)";
because the javascript reads the "-" as syntax error :(
thoughts?
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(4)
将下一个字母改为大写,而不是
-
:style.MozTransform
。(就像
style.backgroundColor
)请注意,IE 错误地使用带有小写
m
的msTransform
。Instead of the
-
, make the next letter uppercase:style.MozTransform
.(just like
style.backgroundColor
)Note that IE incorrectly uses
msTransform
with a lowercasem
.在 javascript 中,您可以通过两种方式访问对象属性:点表示法或数组表示法。特别是当你的属性名称中有特殊字符时,请使用数组表示法:
然后你需要确保该属性适合浏览器,我强烈建议你使用 javascript 库,如 jQuery、Mootools 等,如果你想赢得一些时间并防止网络开发人员在使用这些出色的工具之前遇到一些挫败感......
In javascript you can access object property trought two ways : dot notation or array notation. In particular when you have special chars in the property name, use array notation :
Then you need to insure that the property is right for the browser, I strongly recommend you to use a javascript lib like jQuery, Mootools, etc if you wana win some time and prevent some frustration that web developpers had before these great tools...
使用jquery,只需更改类
Use jquery and just change classes
如果您已经有了内联样式,您可以忽略前缀并更改度数。
元素的 style.cssText 是可读可写的。
If you already have the style inline you can ignore the prefix and change the degrees.
An element's style.cssText is read and writable.