使用 JavaScript 设置内联样式不起作用

Question

我一直在开发一个网站，该网站要求 JavaScript 将内联样式设置为元素。样式必须是内联的，因为它们需要设置的值在 JavaScript 中确定。到目前为止，这段代码在大多数浏览器中都有效（Gears.leftBot指的是元素）：

Gears.leftBot.style = "transform: rotate(20deg);";

但是，在 Microsoft Edge 中，此代码不执行任何操作。我什至直接在控制台中运行这行代码没有结果（能够确认它确实将 Gears.leftBot 识别为一个元素）。我该怎么做才能解决这个问题？

完成JavaScript:

var Gears = {
    //Dependencies
    rightTop: document.getElementById('gear-rt'),
    rightMid: document.getElementById('gear-rm'),
    rightBot: document.getElementById('gear-rb'),
    leftTop: document.getElementById('gear-lt'),
    leftBot: document.getElementById('gear-lb'),

    init : function(){
        Gears.scrollAnima();
    },

    scrollAnima : function(){
        var pos = window.pageYOffset;
        var bigGearDeg = pos / 1.389;
        var midGearDeg = pos * 1.2;
        var litGearDeg = pos * 1.44;
        Gears.rightTop.style = "transform: rotate(" + bigGearDeg + "deg);";
        Gears.rightMid.style = "transform: rotate(-" + midGearDeg + "deg);";
        Gears.rightBot.style = "transform: rotate(" + litGearDeg + "deg);";
        Gears.leftTop.style = "transform: rotate(" + litGearDeg + "deg);";
        Gears.leftBot.style = "transform: rotate(-" + bigGearDeg + "deg);";
        setTimeout(function(){Gears.scrollAnima()}, 15);
    }
};

Gears.init();

Answer 1

尝试：

Gears.leftBot.style.transform = 'rotate(20deg)'

或：

Gears.leftBot.setAttribute('style', 'transform: rotate(20deg);')

使用 JavaScript 设置内联样式不起作用

Setting Inline Styles with JavaScript Not Working

html

javascript

css

microsoft-edge