如何在 javascript 中添加 textshadow 的值

Question

我真的想要 Javascript 中的长阴影，但我不想对它们的每一行进行编码，所以我想将其自动化，这样它就可以像这样工作：

for (let i = 0; i < length; i++) { 
  document.getElementById("text").style.textShadow = i + "px" + ' ' + i + "px" + ' ' + 0 + ' ' + color
}

问题是它不起作用。我也用数组尝试过但没有运气，唯一真正有效的是对每个阴影进行编码，但我想要一个适应性强的解决方案。我该如何尝试实施它？

Answer 1

你只需要在这里使用一个数组来添加所有影子变量，然后将它们作为逗号分隔的字符串加入以获得所需的输出，如：

const color = '#696767';
let shadow = []

for (let i = 0; i < 40; i++) {
  shadow.push(i + "px" + ' ' + i + "px" + ' 0 ' + color)
}

document.getElementById("text").style.textShadow = shadow.join(',')

#text {
  letter-spacing: 0.5rem;
  font-size: 3rem;
  margin-top:0
}

<h1 id="text"> HELLO WORLD </h1>

如何在 javascript 中添加 textshadow 的值

how to add values of textshadow in javascript

html

javascript

css

shadow