我有以下HTML结构:
<div> <h2>Candy jelly-o jelly beans gummies lollipop</h2> <p> Cupcake ipsum dolor sit amet. Sugar plum liquorice dragée oat cake cupcake. </p> <p> Candy tiramisu bonbon toffee. Croissant pudding ice cream soufflé pastry toffee chocolate bar. Tiramisu wypas tootsie roll icing fruitcake oat cake icing soufflé tiramisu. </p> <h2>Dessert pie cake</h2> <ul> <li>liquorice</li> <li>powder</li> <li>dessert</li> </ul> <h2>Chupa chups sweet dragée</h2> <p> Chocolate cake biscuit pie jelly-o chocolate bar. Marshmallow topping sugar plum apple pie brownie cotton candy dragée lemon drops. Soufflé cake toffee. </p> </div>
我只想选择h2之前的内容ul。我怎样才能做到这一点?在我的内容中,越来越uls多的东西,h2s因此解决方案应该是通用的。
h2
ul
uls
h2s
据我所知,CSS没有提供将 在* 选择器 之前定位的任何选择器。您能否将其选择为()之后的? *h2``p``p + h2
h2``p``p + h2
h2 { color: #1a1a1a; } p + h2 { color: #0cc; }
如您所见,这可能是您依赖CSS时可以使用的最佳选择器,尽管您可以轻松地向h2之前的每个类添加一个类ul。这样可以避免您在另一个h2段落和段落节之前有一个段落节的情况。
您可以使用jQuery来做到这一点:
.highlight { color: #0cc; } $('ul').prev('h2').addClass('highlight')
这将选择every ul,然后选择h2之前的,最后将.highlight类添加到其中。
.highlight