Question

我有一个包含在div标签内的项目列表

<div id="contentleft">
<ul>
<li><a href="http://www.google.com">Google<a/></li> //1
<li><a href="http://www.cnn.com">CNN<a/></li> //2
<li><a href="http://www.ign.com">IGN<a/></li> //3
<li><a href="http://www.bing.com">Bing<a/></li> //4
</ul>

我需要定位＃2中的<li>：并使用:eq() filter和css()将其边距更改为30px。我该怎么做？我想要一个解释，所以我会知道我做的不仅仅是回答。

这就是我的尝试：

$("#contentleft ul").eq(0).filter("li").css("margin-left:30");

Answer 1

你非常接近，有几个问题：

1）我不知道它是否是复制粘贴问题，但您的锚标签不正确：

<a href="http://www.google.com">Google<a/>

应该是

<a href="http://www.google.com">Google</a>  // <-- slash before the "a"

2）.eq()需要继续使用您正在编制索引的元素，在本例中为li。 eq()也是从0开始的，因此第二个元素是eq(1)。 .eq()可与选择器中的:eq()互换：

$("#contentleft ul li:eq(1)")或$("#contentleft ul li").eq(1)

3）.css()接受2个参数，样式/值或对象：

$("#contentleft ul li:eq(1)").css("margin-left", "30px");

或

$("#contentleft ul li:eq(1)").css({
    "margin-left": "30px",
    "background-color": "purple"
});

演示：http://jsfiddle.net/gLKMj/

Answer 2

首先，您可以在jquery .eq（）页面上找到答案：http://api.jquery.com/eq/

但是如果您没有互联网接入：

// select the 2nd li element (zero based array so 1 is 2nd)
// change the margin-left to 30px
$('li').eq(1).css('margin-left', '30px');

更改div中单个列表项的边距

2 个答案: