代碼來改變字體顏色的文本是一個鏈接

Question

我有兩行代碼在我的JavaScript來動態改變顏色，一個更改錶行的背景顏色和其他更改字體顏色：

rows[i].style.backgroundColor = 'red' 
rows[i].style.color = 'white' 

我需要一行代碼才能更改字體顏色，特別是它是超鏈接時。我試過：

rows[i].style.link.color = 'white' 

和其他幾個變化，但我不能讓鏈接的字體顏色改變。任何人都可以幫忙嗎？謝謝。

全碼：

var INTENDED_MONTH = 7 //August 
// INTENDED_MONTH is zero-relative 
now = new Date().getDate(), 
rows = document.getElementById('scripture').rows; 
if (new Date().getMonth() != INTENDED_MONTH) { 
    // need a value here less than 1, or the box for the first of the month will be in Red 
    now = 0.5 
}; 
for (var i = 0, rl = rows.length; i < rl; i++) { 
    var cells = rows[i].childNodes; 
    for (j = 0, cl = cells.length; j < cl; j++) { 
     if (cells[j].nodeName == 'TD' 
    && cells[j].firstChild.nodeValue != '' 
    && cells[j].firstChild.nodeValue == now) { 
      rows[i].style.backgroundColor = 'red' 
      rows[i].style.color = 'white' 
      rows[i].style.a.color = 'white' 
      $('html,body').delay(500).animate({ scrollTop: rows[i].offsetTop }, 2000); 
     } 
    } 
} 

Answer 1

如何使用CSS？

tr{ 
    backgorund:red; 
    color:white; 
} 
tr a{ 
    color:white; 
} 

如果你需要的JavaScript，你可以使用

var els=rows[i].getElementsByTagName('a'); 
for(var i=0;i<els.length;i++){ 
    els[i].style.color = 'white'; 
} 

編輯：

您還可以使用

tr a{ 
    color:inherit; 
} 

，然後當你做

rows[i].style.color = 'white' 

錨的顏色將與行的顏色相同 - 白色 - 。

編輯2：

正如我在我的評論說，即使你用JavaScript創建的鏈接，他們是HTML元素，因此CSS影響到他們。

但問題是，規則

table.hovertable a:link, table.hovertable a:visited, table.hovertable a:hover, table.hovertable a:active { 
    color: black; 
} 

覆蓋

table.hovertable tr a { 
    color: inherit; 
} 

然後，你需要

table.hovertable tr a:link { 
    color: inherit; 
} 

其中有選擇:link，所以這兩個規則具有相同的選擇最後一條規則有效。

但我忘了說，inherit不能在IE7和之前工作。然後，你可以使用

rows[i].className+=' selected'; 

和

table.hovertable tr.selected{ 
    color:white; 
    background:red; 
} 

table.hovertable tr.selected a:link{ 
    color:white 
} 

EDIT3：

如果您想設置相同的樣式與當月的單元格，你可以做

var m=new Date().getMonth(); 
document.getElementById('months').rows[Math.floor(m/6)].cells[m%6].className+=' selected'; 

（說明該表有id="months" ）

但隨後

table.hovertable .selected{ 
    color:white; 
    background:red; 
} 

table.hovertable .selected a:link{ 
    color:white 
} 

（.selected而不是tr.selected，現在它是一個td）。

但我看到你仍然使用color:inherit。現在你使用類來設置樣式，你不需要它

Answer 2

行[I] .style.a.color應該工作。 ：鏈接不是真正的課程。如果您向我們顯示行[]和內容

Answer 3

請確保您的頁面上存在html元素的行[i]。在更改顏色以確保您有正確的元素之前，請執行alert(row[i].id);。

你也可以做 document.getElementsByTagName（'ID'+ i）.style.color ='red';

其實它更好地使用css類來處理這類事情。與jQuery一起做將是最簡單的。

Answer 4

恐怕沒有這樣簡單的解決方案。鏈接是該行的子元素，並且不遵循通用文本顏色。我認爲最簡單的解決方案是更改css類行，並在其中定義顏色。

您可以在CSS定義的顏色適當的塊這樣的：

.redHighlighted { background-color: 'red'; color: 'white'; } 
.redHighlighted a, .redHighlighted a:visited, 
.redHighlighted a:hover, .redHighlighted a:active { color: 'green'; } 

然後你就可以做到這一點與單行的javascript：你當然可以

rows[i].setAttribute("class", "redHighlighted"); 

後來只要麼刪除班級，要麼換掉其他班級。 另外請注意，你可能要爲TD元素，在CSS沒有行這樣的指定顏色：

.redHighlighted td { background-color: 'red'; color: 'white'; }