Javascript 如何使用JS更改网格模板列样式？

这是我试图在CSS文件中更改的类

.screen{
margin-top: 0%;
 width: 75%;
 height: 75%;
 background-color: lightgrey;
 display: grid;
 grid-template-columns: repeat(16, 1fr);
 grid-template-rows: repeat(16, 1fr);
}

我分配一个大小变量，然后我假设我可以使用如下内容：

document.getElementsByClassName('screen').style = "grid-template-columns: repeat(" + size + ", 1fr)"

---

但无法使其工作：（

这是因为

document.getElementsByClassName（'screen'）

返回一个数组，所以请尝试使用此

document.getElementsByClassName('screen')[0].style

---

请分享你的html