js怎么修改css属性

var testNode = document.getElementsByClassName("test")[0];

var cssTextBtn = document.getElementsByClassName("cssText")[0];

var attributeBtn = document.getElementsByClassName("setAttribute")[0];

var stylesheetBtn = document.getElementsByClassName("stylesheet")[0];

// 1. 修改style样式:

stylesheetBtn.addEventListener('click', function(e) {

    var stylesheet = document.styleSheets[0];

    stylesheet.cssRules[0].style.backgroundColor = "green";

}, false);

// 2. 修改特定元素节点的style内容

cssTextBtn.addEventListener('click', function(e) {

    testNode.style.cssText = "width: 300px; background-color: red; height: 200px;"

    testNode.style.border = "1px solid black"

}, true);

// 3. 通过setAttribute 修改style属性值

attributeBtn.addEventListener('click', function(e) {

    testNode.setAttribute('style', 'width: 400px; background-color: yellow; height: 300px;')

}, false)