CSS：在JavaScript中的最後一個子選擇器？

我期待選擇最後td在每一行中，並使用此css選擇器現在.table td:last-child，但它不工作在IE瀏覽器，所以有什麼辦法，我可以通過JavaScript選擇（沒有任何框架）爲IE瀏覽器？應用CSS樣式。CSS：在JavaScript中的最後一個子選擇器？

來源

2010-11-15 Shishant

1）IE sux。 2）使用jquery – Mikhail 2010-11-15 15:04:04

是的 - 你可以重新實現支持這種類型選擇的每個框架是否選擇最後一個孩子的元素。這可能不是一大堆代碼，但是真的，爲什麼？只要選擇一個好的框架，並與它一起去。 – tvanfosson 2010-11-15 15:04:28

'最後一個孩子'和'第一個孩子'都應該適用於IE7及更高版本。 – 2010-11-15 15:05:38

var rows = document.getElementById('tester').rows; 

for(var i = 0, len = rows.length; i < len; i++) { 
    rows[ i ].lastChild.style.background = 'orange'; 
}

例子：http://jsfiddle.net/JsyYR/

編輯：如果你在所有瀏覽器上運行這一點，它可能會更安全做到這一點：

var rows = document.getElementById('tester').rows; 

for(var i = 0, len = rows.length; i < len; i++) { 
    rows[ i ].cells[ rows[ i ].cells.length - 1 ].style.background = 'orange'; 
}

例如：http://jsfiddle.net/JsyYR/2/

這是因爲如果最後的</td>和關閉</tr>之間有任何空格，某些瀏覽器將插入文本節點。因此，lastChild將無法正常工作。

來源

2010-11-15 15:07:13 user113716

無論你是否應該是沒有意義的。當然你可能，因爲JavaScript框架可以做到這一點。

無論你是否應該花時間重新發明輪子，只要在JS庫上添加一個小的依賴關係，應該是個問題。

來源

2010-11-15 15:05:44 Oli

這也是一個評論，而不是一個答案。 – 2010-11-15 15:06:20

不是。有效的答案有時包括「不要重新發明輪子，你是愚蠢的。」 – Oli 2010-11-15 15:09:23

在我看來，僅僅爲選擇器使用框架是毫無意義的。 – Shishant 2011-01-12 19:47:21

要做到這一點在JavaScript中，你需要這樣的東西：

var tableRows = document.getElementById('tableid').childNodes 
var tableCells = tableRows[tableRows.length - 1].childNodes; 
var lastCell = tableCells[tableCells.length - 1];

這是假定該表是與標籤之間沒有任何的格式。沒有人或者這樣的人。

或者，您可以簡單地使用getElementByTagName('td')並獲取返回數組的最後一個元素。這樣做的缺點是它不適用於具有多個表格的頁面。

來源

2010-11-15 15:06:40

如果瀏覽器缺失，通常會插入「」。無論如何，這隻會影響最後一行的最後一個單元格。 – user113716 2010-11-15 15:11:10

這就是爲什麼我說假設沒有tbody。無論如何，它不是一個巨大的邏輯飛躍，以適應不同的HTML結構的代碼。 – 2010-11-15 15:15:30

我的觀點是，你不能假設''因爲瀏覽器可能會爲你插入它。 – user113716 2010-11-15 15:17:30

在Javascript中，您可以在任何DOM對象上引用.lastChild，但是您必須首先獲取元素，因此如果沒有jQuery或類似的元素，它並不像聽起來那麼容易。

顯而易見的答案是「使用JQuery」。你已經指出了這一點（即「沒有任何框架」），但它是迄今爲止最明顯的解決方案。

另一種解決方案是Dean Edwards' IE7.js（及相關IE8.js和IE9.js），這是一個Javascript包括試圖修補IE瀏覽器的舊版本，並與標準的CSS兼容性更好，等等。我相信它修復:last-child選擇。但是，它又是一個第三方庫，所以你可能不想使用它。

當然，您可以爲您希望最後一個子樣式應用到的元素添加一個額外的類，然後在CSS而不是最後一個孩子中引用它。由於last-child專門用於避免您必須這樣做，因此不是理想選擇，但它確實可以確保兼容性。

來源

2010-11-15 15:13:59 Spudley

CSS：在JavaScript中的最後一個子選擇器？

回答

相關問題