Javascript 如何将变量传递给CSS grid repeat（）函数

我正在尝试创建一个函数，该函数将JS变量作为一个术语传入CSS网格重复函数。我不知道如何做到这一点，也找不到谷歌的结果，下面是我试图估计一个可能的实现

这是奥丁项目的蚀刻草图项目，一切都是香草

let test = 5;

function create() {
    for (let i = 0; i < gridsize; i++) {
    div = document.createElement('div')
    div.style.backgroundColor = "#39CCCC"
    div.style.border = "2px solid black"
    div.classList.toggle("mini")
    container.addEventListener("mouseover", function(e){
  e.target.style.backgroundColor = "black";
})
    container.style.gridTemplate = "repeat(test, 1fr) / repeat(test, 1fr)"
    container.appendChild(div)
  }
}

没有出现错误消息，包含CSS函数的JS被忽略。代码运行得非常好，就好像从未编写过特定的行一样。

使用字符串将变量注入字符串。现在您正在输出一个字符串，其中包含单词test。由于元素不是有效的CSS，所以不会在元素上设置

您需要将变量的值传递到字符串中

container.style.gridTemplate = `repeat(${test}, 1fr) / repeat(${test}, 1fr)`;

container.style.gridTemplate = "repeat(" + test + ", 1fr) / repeat(" + test + ", 1fr)";

或者，如果无法使用模板文本，请连接字符串

container.style.gridTemplate = `repeat(${test}, 1fr) / repeat(${test}, 1fr)`;

container.style.gridTemplate = "repeat(" + test + ", 1fr) / repeat(" + test + ", 1fr)";

---

@randomSoul删除引号会产生一个未捕获的语法错误。你能重现这个问题吗？@weegee repeat是一个CSS值，与JS无关：@randomSoul repeat是一个CSS值，与JS无关：@weegee上面列出的代码不是吗？