How to change background with javascript?

7

I have a function in javascript that returns the day and time for text, for insertion into html, how can I add styles to this text, should I do within javascript or even in html

    function date_time(id){


    date = new Date;
    year = date.getFullYear();
    month = date.getMonth();
    months = new Array('Janeiro', 'Fevereiro', 'Março', 'Abril', 'Maio', 'Junho', 'Julho', 'Agosto', 'Setembro', 'Outbro', 'Novembro', 'Dezembro');
    d = date.getDate();
    day = date.getDay();
    days = new Array('Domingo', 'Segunda - Feira', 'Terça - Feira', 'Quarta - Feira', 'Quinta - Feira', 'Sexta - Feira', 'Sabado');
    h = date.getHours();
    if(h<10)
    {
            h = "0"+h;
    }
    m = date.getMinutes();
    if(m<10)
    {
            m = "0"+m;
    }
    s = date.getSeconds();
    if(s<10)
    {
            s = "0"+s;
    }
    result = 'Bem Vindo, Hoje é '+days[day]+' '+d+' '+months[month]+' '+year;
    document.getElementById(id).innerHTML = result;
    setTimeout('date_time("'+id+'");','1000');
    return true;
    }

Html

    <span id="date_time"></span>
<script type="text/javascript">window.onload = date_time('date_time');</script>

Result

    
asked by anonymous 14.02.2014 / 15:44

4 answers

2

You have to change the style of this span. Since it already has a color, just change it: Look for #EC2028 (or rgb(236,32,40) ) in the rest of the code and switch to color you want.

By literally interpreting your question, use:

// Muda a cor do fundo:
document.getElementById('date_time').style.backgroundColor = 'blue'; // ou a cor que quiser

// Muda a cor do texto:
document.getElementById('date_time').style.color = 'black';
    
14.02.2014 / 15:50
0

You can use .style to set the properties of the element Home Example:

document.getElementById(id).style.color="blue";

In this way you can add any attributes in your element

    
14.02.2014 / 15:51
0

Answer:

You have 3 options, which are:

(1) - You can change the color of the text by applying a CSS style to your <span> element, for example:

#date_time {
  color: #FFF; /*branco*/
}

(2) - You can also do via javascript:

document.getElementById('date_time').style.color = '#fff';//codigo hexadecimal para branco

(3) - You can also implement style directly applied to the html (inline style) element that would be in your HTML:

<span id="date_time" style="color:#FFF"></span>

Explanation:

An HTML element can have styles applied to it in different ways, the browser interprets all styles that are referring to its element, there may be overlapping styles as well, the more important it will always be the more specific, or the one you have the !important tag.

The most recommended solution is (1) that would apply a CSS style to your CSS code for your page, it could be an external.css file or a <style> .

But you can choose what works best for you.

    
14.02.2014 / 15:55
-1

Hello, I joined this using jquery, because I do not know much javascript, but you could not add classes according to time? and treat the colors and styles according to the class added?

Follow example link

    
15.02.2014 / 02:55