next（）和nextall＆gt;

Question

我有以下结构

<h2> title </h2>
<ul>
<li></li>
<li></li>
<li></li>
</ul>

<h2> title 2 </h2>
<ul>
<li></li>
<li></li>
<li></li>
</ul>

我正在使用Jquery.load()功能，它看起来像这样：

<script> $('#result').load('http://www.mysite/page h2:contains(title)'  ) ;

这可以让我到h2 ..但我似乎无法到达NEXT元素..他们必须匹配吗？即他们都必须是相同的标签。我试过了：

<script> $('#result').load('http://www.mysite/page h2:contains(title).next(li:lt(3)'  ) ;

但它不起作用..我需要选择3 li的每个指定的h2

提前致谢。

Answer 1

首先，您在css选择器中使用jquery方法。那是无效的CSS。其次，这似乎对我有用：

$('#result').load('http://www.mysite/page h2:contains(title) + ul > li:nth-child(-n+3)');

此css将选择相邻的ul，即ul的直接后代，li以及前三个。{/ p>

Answer 2

请改为尝试：

$('#result').load('http://www.mysite/page h2:contains(title) + ul li:nth-child(1),li:nth-child(2)');

<强> Working Demo

Answer 3

建立@Kundan Singh Chouhan的答案，完全相同的事情只能在没有任何JavaScript的CSS中完成。

DEMO：http://jsfiddle.net/dfUH8/12/

h2 + ul li:nth-child(1),
li:nth-child(2){
    background-color: red;
}

虽然，这只适用于支持CSS3的较新浏览器，因为JavaScript版本可以在任何地方使用。