javascript - 将 JavaScript 合并到 HTML 中以创建 pantone 样式的栏

Question

我正在尝试制作一个 pantone 风格的专栏，其中一个完全是红色的 div，而其他的则全部是红色的渐变色。基本上，我有一个用于不透明度的变量“op”，它从 1 开始并逐渐减小，直到等于 0.1。这是我使用的代码(在 Codepen 上)。 '.column' 是我的大容器，'.box' 用于所有较小的 div。我的问题是编辑器无法将“op”识别为 div 样式的一部分。我该如何解决这个问题？

var op = 1;
for (var i = 0; i <= 10; i++) {
$('.column').append('<div class="box", style="opacity:op;">Hello.</div>')
op = op - .1
}

Answer 1

var op = 1;
for (var i = 0; i <= 10; i++) {
$('.column').append('<div class="box", style="opacity:'+op+';">Hello.</div>')
op = op - .1
}

插入变量

与大多数其他语言一样，Javascript 没有 native 字符串解析器。