Question

我想在我的scss文件中使用泛型类，如果我只传递颜色值，则设置颜色和border属性。我不想在我的scss文件中硬编码颜色值。

var delayMinimum = 1000;
var delayMaximum = 5000;

function UpdateTiles()
{
    var width = 0;
    var delay = 0;
    var percent = 0;
    var divNameLabel = "";
    var divNameValue = "";
    var divNameProgress = "";

    if (Math.floor((Math.random() * 100) + 1) > 30)
    {
        percent = Math.floor((Math.random() * 100) + 1);
        width = Math.floor(80 * percent / 100);
        divNameLabel = "DivDashboardTileTemplatesLabel";
        divNameValue = "DivDashboardTileTemplatesValue";
        divNameProgress = "DivDashboardTileTemplatesProgress";
        document.getElementById(divNameValue).innerText = percent.toString() + "%";
        $("div#" + divNameProgress).animate({ width: (width.toString() + "px"), }, delayMinimum);
    }

    if (Math.floor((Math.random() * 100) + 1) > 30)
    {
        percent = Math.floor((Math.random() * 100) + 1);
        width = Math.floor(80 * percent / 100);
        divNameLabel = "DivDashboardTileDocumentsLabel";
        divNameValue = "DivDashboardTileDocumentsValue";
        divNameProgress = "DivDashboardTileDocumentsProgress";
        document.getElementById(divNameValue).innerText = percent.toString() + "%";
        $("div#" + divNameProgress).animate({ width: (width.toString() + "px"), }, delayMinimum);
    }

    if (Math.floor((Math.random() * 100) + 1) > 30)
    {
        percent = Math.floor((Math.random() * 100) + 1);
        width = Math.floor(80 * percent / 100);
        divNameLabel = "DivDashboardTileFormsLabel";
        divNameValue = "DivDashboardTileFormsValue";
        divNameProgress = "DivDashboardTileFormsProgress";
        document.getElementById(divNameValue).innerText = percent.toString() + "%";
        $("div#" + divNameProgress).animate({ width: (width.toString() + "px"), }, delayMinimum);
    }

    delay = Math.floor((Math.random() * (delayMaximum - delayMinimum)) + delayMinimum);
    window.setTimeout(UpdateTiles, delay);
}

$(document).ready(UpdateTiles);

如何从html类名传递参数？

Answer 1

我为您创建了一个JSFiddle：enter link description here

HTML：

<p class="item" data-test="red">Vikramaditya</p>

SCSS：

p::before {
  content: attr(data-test) " ";
}

请注意： attr（）函数可以与任何CSS属性一起使用，但对内容以外的属性的支持是实验性的。

来源：enter link description here

将值传递给HTML中的scss类

1 个答案: