使用JavaScript根据数据库的值有条件地生成HTML

Question

我是 JavaScript 新手，我不知道为什么这不起作用。

我有一个 .csv 文件，它使用其数据填充图表，我想在数据库中的某个值为 true 时应用某个 CSS 类/id。

这是我的 HTML：

<div class="box-hidden" ${d.data.mobile_masque === true ? 'id="blur-effect"' : ''}> ${d.data.mobile.replace(/(.{2})/g, "$1 ")} </div>

因此，如果

d.data.mobile_masque

为 true，我希望 HTML 为：

<div class="box-hidden" id="blur-effect"> ${d.data.mobile.replace(/(.{2})/g, "$1 ")} </div>

要渲染图表，我正在使用此 GitHub：https://github.com/bumbeishvili/org-chart

当我一步步运行页面中的代码时，我可以看到

d.data.mobile_masque

的值确实是true（参见屏幕截图），但它没有添加id部分。

如果我尝试

${console.log(d.data.mobile_masque)};

，它只会在网页中显示

undefined;

。

页面上的所有其他数据都没有问题，只是比较器似乎不起作用或者我未能正确使用它。

Answer 1

@BGPHiJACK 非常感谢，这就是问题所在，现在可以完美运行了。 我把它改成了

<div class="box-hidden" ${d.data.mobile_masque == 1 ? 'id="blur-effect"' : ''}> ${d.data.mobile.replace(/(.{2})/g, "$1 ")} </div>

@rand'Chris，感谢您花时间回答我的问题，屏幕截图显示浏览器控制台线上有一个断点，我的鼠标悬停在

d.data.mobile_masque

上，显示它具有正确的数据。