js 动态修改 div 样式

// 获取div元素
var div = document.getElementById('myDiv');

// 修改样式
div.style.backgroundColor = 'blue';
div.style.width = '200px';
div.style.height = '100px';

<!-- HTML -->
<div id="myDiv" class="default-style"></div>

/* CSS */
.default-style {
  background-color: red;
  width: 100px;
  height: 50px;
}

.new-style {
  background-color: green;
  width: 200px;
  height: 100px;
}

// JavaScript
var div = document.getElementById('myDiv');
div.classList.remove('default-style');
div.classList.add('new-style');

window.onload = function() {
  var div = document.getElementById('myDiv');
  div.style.backgroundColor = 'blue';
};

function animate() {
  var div = document.getElementById('myDiv');
  div.style.transform = 'translateX(10px)';
  requestAnimationFrame(animate);
}
animate();