使用Javascript应用CSS

Question

如何在JavaScript中应用类似于以下CSS的元素：

.watch-non-stage-mode .player-width {
    width : 640px !important;
}

我尝试这样做，但无法正常工作：

document.getElementByClassName('.watch-non-stage-mode .player-width').style.width = '640px !important';

Answer 1

尝试使用querySelector ：

document.querySelector('.watch-non-stage-mode .player-width').style.width = '640px'

或!important是否必需：

document.querySelector('.watch-non-stage-mode .player-width').style.cssText = 'width: 640px !important;'

在您的情况下，您也可以使用getElementsByClassName ，但是您错误地获得了一个节点，必须是：

document.getElementsByClassName('watch-non-stage-mode player-width')[0]

Answer 2

必须将“ px”和“！important”单位分别添加到属性中。 做：

document.querySelector('.watch-non-stage-mode .player-width').style.width = 640 + 'px' + '!important';

另外，请按照说明使用querySelector通过实际的点类名选择元素。 您不能以显示方式使用“ .classname”（无论如何还是不正确的）。 元素是复数。 getElement 的 ByClassName