CSS選擇器：類與編號

如果想要達到的速度，加載時間更好的表現，等我讀過型JavaScript中使用（jQuery的爲好）選擇事項CSS選擇器：類與編號

做了同樣的申請到CSS呢？如果是這樣，哪個選擇器更適合在DOM中使用：id，class還是嵌套？我在這裏談論某些元素（如特定的<ul>而不是所有的<ul>一般）。

來源

2012-08-28 PepeManshon

這裏有太多的因素......太多以至於有足夠的非性能問題超過性能問題，例如，當您提到需要選擇特定的'ul'而不僅僅是'ul'時，一般來說。如果您不必擔心，性能完全沒有實際意義。 – BoltClock

使用最簡單的選擇器（除非存在衝突，在這種情況下更具體）... – xandercoded

兩個頁面上的HTML元素不能有相同的，所以對單個元素的處理是很好用的ID .. 同一個類可以通過許多元素使用id所以組操作是很好用..類在性能方面，兩者對我都有好處

來源

2012-08-28 14:32:14 Aravind

聲明不能包含兩個HTML元素並且該語句實際上不是真正的（http://jsfiddle.net/sBPkM/），雖然這不是很好的做法。我想你可能指的是Visual Studio阻止引用服務器端控件的HTML元素，它不能具有相同ID的兩個元素。 – dbooth

當在事件處理中使用jquery和javascript時，具有相同的ID會導致衝突。 – Aravind

@dbooth：是的。該規範說「不得」，但當然人們寫無效標記，瀏覽器必須以他們知道的最好方式處理無效標記。另外，ID選擇器在JS和CSS中的實現方式不同，因此存在不一致的行爲。見[這個答案]（http://stackoverflow.com/questions/7262195/several-elements-with-the-same-id-responding-to-one-css-id-selector/8753329#8753329）和評論[這個問題]（http://stackoverflow.com/questions/5797014/why-do-browsers-match-css-selectors-from-right-to-left）。 – BoltClock

This is a pretty good reference確保您使用良好的CSS實踐，但要小心不要過早地嘗試「過度優化」。

來源

2012-08-28 14:33:48

不錯的參考:)謝謝...這是要證明我的說法，我聽說身份證比類更快，但我沒有參考這 – haynar

@ haynar1658是的我最近才發現這個，不敢相信我去了很久沒有它。特別是，我不知道直接後代（'>'）操作符如此低效。 –

很好的參考。請特別注意本文檔的「好/壞」部分。你會學到很多東西。但總的來說，對於今天的現代計算機來說，CSS性能通常不是問題，除非你提供數百萬頁。 – jkinz

因爲我已經閱讀了很多次ID查找元素比類更快，因爲具有ID的元素被存儲爲哈希表並且搜索速度更快。

不幸的是，我不知道任何資源來證明或拒絕這一點，但正如我已經說過，我已經看到了很多這樣的陳述。

來源

2012-08-28 14:36:01 haynar

只要你知道，不要根據這些知識進行編碼。基於你的標記的代碼。 – BoltClock

@BoltClock當然，每個規則都應該根據情況使用，而不僅僅是因爲它是真的，或者我認爲它可能是真實的 – haynar

我懷疑它CSS會在加載時間和速度上造成很大的渲染麻煩。以我的經驗，我已經得出結論，你應該保持你的CSS很好，很簡單。我見過的東西，如：

.element1 {...} 
    .element1 #element2 {...} 
    .element1 #element2 .element3 {...}

但我寧願用獨特的選擇去儘可能地簡單地形容爲：

.element1 {...} 
#element2 {....}

在我看來優化CSS是相當棘手，你應該做的它仔細。

來源

2012-08-28 14:36:53

CSS選擇器：類與編號

回答

相關問題