0

У меня есть HTML:

 <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <title>Document</title>
        <link rel="stylesheet" href="./css/style.css">
    </head>
    <body>
        <div id="root">
        
        <h1>
            <span class="yellow">JavaScript.</span>
            Браузерное окружение. 
            Работа с <span class="yellow">DOM.</span>
        </h1>
        <h3>Урок №3</h3>
        <div class="lesson">
            <div class="lesson__text">
                Текст
            </div>
        </div>
    
        </div>   
        <script src="./js/app.js"></script>
    </body>
    </html>

и JS:

  const bodyEl = document.body;
    bodyEl.style.backgroundColor = '#282323';
    
    const rootEl = document.getElementById('root');
    
    
    const YellowEl = document.getElementsByClassName('yellow')[0].style.color = "yellow";

Проблема в том что я не знаю как поменять цвет тега yellow и на JavaScript и на DOM.

Я хотел поменять цвет на желтым тега yellow и сделал так:

const YellowEl = document.getElementsByClassName('yellow')[0,1].style.color = "yellow";

Но поменялся только цвет тега DOM.

2
  • в цикле пройди по всем элементам
    – kost1k
    14 мая 2021 в 14:37
  • Спасибо Вам !!!
    – Jones
    14 мая 2021 в 14:43

2 ответа 2

0

Можно как-то так
CSS


:root {
    --set-color: #330;
}

.myClass {
    color: var(--set-color);
}

JS


document.documentElement.style.setProperty('--set-color', '#005');

А еще лучше
CSS


:root {
    --set-color: #330;
    --color1: #330;
    --color2: #005;
}

.myClass {
    color: var(--set-color);
}

JS


document.documentElement.style.setProperty('--set-color', '--color2');

0

Попробуйте так:

let all = document.querySelectorAll('.yellow');

for(let a of all) {
    a.style.color = "yellow";
}

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.