3

我有一些可怕的代码需要处理

...
<div class="container">
   ...
    <tr>
    <td width="100" height="50">
         <a class="swaps"><img src="http://www.blah.jpg" alt="Some Title" id="1"></a></span></td>
    </tr>
   <tr>
    <td width="100" height="50">
        <a class="swaps"><img src="http://www.blah2.jpg" alt="Another title" id="2"></a></span></td>
    </tr>
</div>

如果我使用

var thisone = $("#container .swaps:first")

选择第一个（id 为 1）为什么我无法选择

thisone.next()?

4

8 回答 8

4

HTML是真实的吗？我没有看到任何 id 为“container”的元素，而你正在做

$("#container .swaps:first")

另外，如果它是真正的 HTML，你应该稍微修复一下（关闭 img 标签，并在 </TD> 之前添加 span 的开始标签）

假设您的 HTML 没问题，这应该适用于您的场景。

var thisone = $("#container .swaps:first");
thisone.children();

IMG 不是主播的兄弟姐妹，是一个孩子。

于 2010-04-07T03:17:28.860 回答
1

因为，正如 Jquery 文档所说：

:first 伪类等价于 :eq(0)。它也可以写成:lt(1)。虽然这仅匹配一个元素，但 :first-child 可以匹配多个：每个父元素一个。

尝试.children() 使用$(selector).children();

于 2010-04-07T03:17:45.193 回答
1

next() 方法检查兄弟姐妹是否匹配...在您的场景中，没有其他具有 .swaps 类的兄弟姐妹...尝试 $("#container .swaps")

于 2010-04-07T03:19:02.540 回答
1

jQuery 的next()函数返回所有匹配元素的下一个兄弟，因为它们出现在 DOM 树中（不在 jQuery 结果集中）。所以打电话

$("#container .swaps:first")

获取第一个锚点，并调用next()它返回 undefined 因为它没有下一个兄弟。如果您想通过调用连续访问节点，我认为您可能需要实现迭代器模式next()。

jQuery 对象是一个项目数组。您可以将当前索引存储在一个变量中，并在获取下一个元素后递增它。

// Naive way
var items = $("#container .swaps");
var i = 0;
items[i++] // first <a>
items[i++] // second <a>

这里有两个使用迭代器模式包装上述功能的实现——一个作为 jQuery 插件工作，另一个基本上是一个单独的函数。两者的工作方式相同：

// Iterator function
function Iterator(list) {
    var results = list;
    var i = 0;

    this.next = function() {
        return results[i++];
    };

    return this;
}

// Usage
var iterator = Iterator($("#container .swaps"));
iterator.next() // first <a>
iterator.next() // second <a>

第二个与第一个几乎相同，但使用的是 jQuery 插件：

// jQuery plugin
$.fn.iterator = function() {
    var i = 0;

    this.next = function() {
        return this[i++];
    };

    return this;
};

// Usage
var iterator = $("#container .swaps").iterator();
iterator.next() // first <a>
iterator.next() // second <a>

Javascript 1.7 在生成器和迭代器中有一些很酷的特性可以做到这一点，但它还没有普及——据我所知，只有 Firefox 支持它。

于 2010-04-07T19:56:06.287 回答
0

您正在使用:first，它将集合减少到一个，因此没有“下一个”。您可以尝试:first-child改用。

于 2010-04-07T03:16:10.630 回答
0

在您的示例thisone.next()中，实际上应该什么都没有，因为原始选择没有兄弟姐妹（在同一级别）。你想要的是 的孩子thisone，这是一个 img，使用thisone.children("img").

于 2010-04-07T03:16:40.880 回答
0

你的选择器应该是

var thisone = $("div.container a.swaps:first");
var img = thisone.children(img);

你的身份证也是无效的。您不能以数字开头。

于 2010-04-07T06:31:18.983 回答
0

首先，我知道这不是您的代码，但 ID 不应以数字开头或仅包含数字。

我不确定你想要做什么，但我认为如果你只是遍历所有这样的事情会更容易.swaps：

$('#container .swaps').each(function(){
 var swapImg = $(this).find('img');
 // do something else
})
于 2010-04-07T13:47:50.133 回答