JS Как добавить переменную в span

Question

Я новичок ie, и я хочу знать, как поместить переменную x в тег span, чтобы я мог изменить цвет переменной.

function wyr()
{
    var x = (Math.floor(Math.random() * 100) + 1);

    if(x <= 33)

        document.getElementById("x").innerHTML = x + '<span style="color:red;">%</span>';

    else if(x >= 34 && x <= 66)

        document.getElementById("x").innerHTML = x + '<span style="color:blue;">%</span>';

    else

        document.getElementById("x").innerHTML = x + '<span style="color:yellow;">%</span>';
}
``

Answer 1

Вы можете использовать строковый / шаблонный литерал .

document.getElementById("x").innerHTML = `<span style="color:red;">${x}</span>`;

Использовать обратные кавычки вместо кавычек, и ваша переменная входит в $ {}. Все между галочками будет интерполировано в строку, включая переменную внутри $ {}.

Answer 2

Что ж, если все, что вы хотите сделать в конце дня, это изменить цвет диапазона, перейдите непосредственно к методу 3.

Есть много способов сделать это:

1 - Basi c конкатенация строк:

document.getElementById("x").innerHTML = '<span style="color:red;">' + x + '</span>';

2- Шаблонные литералы (где необходимо использовать кавычки (`) вместо кавычек):

document.getElementById("x").innerHTML = x + `<span style="color:red;">${x}</span>`;

3- Почему бы просто не использовать CSS для изменения цвета? Предполагая, что вы вставляете свой <span> непосредственно в HTML, и что этот диапазон имеет идентификатор «mySpan», вы можете сделать:

var span = document.getElementById('mySpan');
span.style.color = 'red';