Change the background color and text color with a timer with Javascript

问题

I'm trying to change both the background and text color of a table and all its cells with a timer. I have the script below just before the end tag. The background is the only thing that changes. The id of the table is 'titleTable'. Thanks

<script language="Javascript">
<!-- Begin
titleTable.bgColor='#FFFFFF';
setInterval("Timer()", 500);
x=1;
function Timer() {
    set=1;
    if(x==0 && set==1) {
        titleTable.bgColor='#000000';
        titleTable.style.color='#FFFFFF';
        x=1;
        set=0;
    }
    if(x==1 && set==1) {
        titleTable.bgColor='#FFFFFF';
        titleTable.style.color='#000000';
        x=0;
        set=0;
    }
}
// End -->
</script>

回答1:

(function() {
    var s = document.getElementById('titleTable').style,
        f = false,
        c1 = '#000000',
        c2 = '#ffffff';

    setInterval(function() {
        s.backgroundColor = f ? c1 : c2;
        s.color = f ? c2 : c1;
        f = !f;
    }, 500);
})();

Live demo: http://jsfiddle.net/Dzk2h/2/

Just put the above code inside a <script> element at the bottom of your page.

回答2:

var titleTable = document.getElementById('titleTable');

if(x==0 && set==1)
->
if((x==0) && (set==1))

Just use "blink" tag =)

Ah, "The background is the only thing that changes". Check styles. If you have CSS rule like

#titleTable td { color: black; }

It will not be overriden by setting inline style to the table.

来源：https://stackoverflow.com/questions/4925099/change-the-background-color-and-text-color-with-a-timer-with-javascript