在jQuery/JavaScript的IE8中僞造CSS：唯一的孩子

Question

我有一個菜單：only-child選擇器，以便我可以指示子菜單。在IE8之後（我唯一需要支持的唯一舊IE版本）後，選擇器工作：但是：獨生子選擇器沒有，所以我在每個菜單項上都選擇了一個箭頭，而不是僅在子菜單上。

.menu li > a:after { content: ' ▾'; } 
.menu li > a:only-child:after { content: ''; } 

我想要的是使用jQuery或JavaScript來實現這一點。 我不想使用Modernizr或Selectivizr以及所有這些東西，只是一個代碼作爲獨子的替代方案。

我真的很感激，如果你能幫助我。當談到jQuery和JavaScript時，我是一個新手，所以請詳細解釋。謝謝！

Answer 1

對於其他人知道這件事，也沒有得到@ BoltClock的代碼相同的問題的工作，將最有可能，如果你改變$到jQuery工作，像這樣：

jQuery("SELECTOR").exampleMethod("EXAMPLESTRING"); 

Answer 2

jQuery implements most CSS selectors for you，包括:only-child，這使得使用較新的選擇器來定位舊版瀏覽器中的元素非常容易。事實上，Selectivizr依賴於另一個JavaScript庫，比如jQuery，以便直接在CSS中實現選擇器。

如果你可以使用jQuery，你可以簡單地讓jQuery處理:only-child選擇器，給唯一的孩子分配一個你可以用你的CSS規則定位的類。與Selectivizr不同，jQuery只允許您在腳本中使用選擇器，而不是直接在樣式表中使用，因此您必須改爲使用類名稱。

CSS：

.menu li > a:after { content: ' ▾'; } 
.menu li > a.only-child:after { content: ''; } /* Notice the class selector */ 

JS：

$('.menu li > a:only-child').addClass('only-child'); 

---

_{沒有與Selectivizr阻止你的僞類和僞元素相結合的已知問題選擇器，所以無論如何你都無法在這種情況下使用Selectivizr。}