blocks|key|309266|text|HTML是真的吗？我没有看到任何id为"container“的元素，而你正在做|type|unstyled|depth|inlineStyleRanges|entityRanges|data|309267|$("#container+.swaps:first")|offset|length|style|CODE|309268|而且，如果它是真正的HTML，您应该对其进行一些修改(关闭img标记，并在|309269|假设您的HTML是OK的，那么这应该适用于您的场景。|309270|var+thisone+=+$("#container+.swaps:first");
thisone.children();|code-block|syntax|javascript|309271|IMG不是锚的同级，而是子对象。|309272|entityMap^0|0|0|S|0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|U|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|V|8|@$D|W|E|X|F|G]]|9|@]|A|$]]|$1|H|3|I|5|6|7|Y|8|@]|9|@]|A|$]]|$1|J|3|K|5|6|7|Z|8|@]|9|@]|A|$]]|$1|L|3|M|5|N|7|10|8|@]|9|@]|A|$O|P]]|$1|Q|3|R|5|6|7|11|8|@]|9|@]|A|$]]|$1|S|3|-4|5|6|7|12|8|@]|9|@]|A|$]]]|T|$]]

The HTML is the real one? I don't see any element with id "container" and you're doing 

<code> $("#container .swaps:first")</code>

Also, if it's the real HTML, you should fix it a little (close the img tag, and add the opening tag for the span before the &lt;/TD&gt;)

Supposing that your HTML is OK this should work for your scenario. 

<pre><code>var thisone = $("#container .swaps:first");
thisone.children();</code></pre>

The IMG is not sibling of the anchor, is a child.

blocks|key|309301|text|因为，正如Jquery文档所说：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|309302|309303|：第一个伪类等同于:eq(0)。它也可以写成:lt(1)。虽然这只匹配一个元素，但:first-child可以匹配多个元素:每个父元素对应一个元素。|blockquote|309304|309305|309306|尝试像在$(selector).children();中一样使用.children()|offset|length|style|CODE|309307|entityMap^0|0|0|0|0|0|4|N|W|B|0^^$0|@$1|2|3|4|5|6|7|P|8|@]|9|@]|A|$]]|$1|B|3|-4|5|6|7|Q|8|@]|9|@]|A|$]]|$1|C|3|D|5|E|7|R|8|@]|9|@]|A|$]]|$1|F|3|-4|5|6|7|S|8|@]|9|@]|A|$]]|$1|G|3|-4|5|6|7|T|8|@]|9|@]|A|$]]|$1|H|3|I|5|6|7|U|8|@$J|V|K|W|L|M]|$J|X|K|Y|L|M]]|9|@]|A|$]]|$1|N|3|-4|5|6|7|Z|8|@]|9|@]|A|$]]]|O|$]]

Because, as Jquery docs says:

<blockquote>
 The :first pseudo-class is equivalent
 to :eq(0). It could also be written as
 :lt(1). While this matches only a
 single element, :first-child can match
 more than one: One for each parent.
</blockquote>

Try using <code>.children()</code>
as in <code>$(selector).children();</code>

blocks|key|309321|text|下一个()方法检查同级容器您的场景中没有其他同级容器具有.swaps+class...try+$(“#+matches...in+.swaps")|type|unstyled|depth|inlineStyleRanges|entityRanges|data|309322|entityMap^0|0^^$0|@$1|2|3|4|5|6|7|D|8|@]|9|@]|A|$]]|$1|B|3|-4|5|6|7|E|8|@]|9|@]|A|$]]]|C|$]]

the next() method checks siblings for matches...in your scenario there are no other siblings with .swaps class...try $("#container .swaps")

blocks|key|1581401|text|jQuery的next()函数返回所有匹配元素在DOM树(而不是jQuery结果集中)中出现的下一个同级元素。所以打电话给|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|1581402|$("#container+.swaps:first")|code-block|syntax|javascript|1581403|获取第一个锚点，并对其调用next()返回undefined，因为它没有下一个同级。我认为，如果您希望通过调用next()来连续访问节点，则可能需要实现Iterator+pattern。|1581404|jQuery对象是一个项目数组。您可以将当前索引存储在一个变量中，并在获得下一个元素后递增它。|1581405|//+Naive+way
var+items+=+$("#container+.swaps");
var+i+=+0;
items[i%2B%2B]+//+first+<a>
items[i%2B%2B]+//+second+<a>|1581406|这里有两个使用迭代器模式包装上述功能的实现-一个用作jQuery插件，另一个基本上是一个单独的函数。两者的工作方式相同：|1581407|//+Iterator+function
function+Iterator(list)+{
++++var+results+=+list;
++++var+i+=+0;

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

++++return+this;
}

//+Usage
var+iterator+=+Iterator($("#container+.swaps"));
iterator.next()+//+first+<a>
iterator.next()+//+second+<a>|1581408|第二个与第一个几乎相同，但使用的是jQuery插件：|1581409|//+jQuery+plugin
$.fn.iterator+=+function()+{
++++var+i+=+0;

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

++++return+this;
};

//+Usage
var+iterator+=+$("#container+.swaps").iterator();
iterator.next()+//+first+<a>
iterator.next()+//+second+<a>|1581410|JavaScript1.7在generators+and+iterators中有一些很酷的特性可以做到这一点，但它还没有普及--据我所知，只有火狐支持它。|1581411|entityMap|0|LINK|mutability|MUTABLE|url|http://en.wikipedia.org/wiki/Iterator_pattern|1|https://developer.mozilla.org/en/New_in_JavaScript_1.7#Generators^0|7|6|0|0|D|6|1J|6|24|G|0|0|0|0|0|0|0|0|E|O|1|0^^$0|@$1|2|3|4|5|6|7|1A|8|@$9|1B|A|1C|B|C]]|D|@]|E|$]]|$1|F|3|G|5|H|7|1D|8|@]|D|@]|E|$I|J]]|$1|K|3|L|5|6|7|1E|8|@$9|1F|A|1G|B|C]|$9|1H|A|1I|B|C]]|D|@$9|1J|A|1K|1|1L]]|E|$]]|$1|M|3|N|5|6|7|1M|8|@]|D|@]|E|$]]|$1|O|3|P|5|H|7|1N|8|@]|D|@]|E|$I|J]]|$1|Q|3|R|5|6|7|1O|8|@]|D|@]|E|$]]|$1|S|3|T|5|H|7|1P|8|@]|D|@]|E|$I|J]]|$1|U|3|V|5|6|7|1Q|8|@]|D|@]|E|$]]|$1|W|3|X|5|H|7|1R|8|@]|D|@]|E|$I|J]]|$1|Y|3|Z|5|6|7|1S|8|@]|D|@$9|1T|A|1U|1|1V]]|E|$]]|$1|10|3|-4|5|6|7|1W|8|@]|D|@]|E|$]]]|11|$12|$5|13|14|15|E|$16|17]]|18|$5|13|14|15|E|$16|19]]]]

jQuery's <code>next()</code> function returns the next sibling as they appear in the DOM tree (not in jQuery resultset) for all matched elements. So calling

<pre><code>$("#container .swaps:first")
</code></pre>

gets the first anchor, and calling <code>next()</code> on it returns undefined as it has no next sibling. I think you might want to implement the <a href="http://en.wikipedia.org/wiki/Iterator_pattern" rel="nofollow noreferrer">Iterator pattern</a> if you want to access the nodes successively by calling <code>next()</code>.

The jQuery object is an array of items. You could just store the current index in a variable, and increment it after getting the next element.

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

Here are two implementations that wrap the above functionality using the Iterator pattern - one that works as a jQuery plugin, the other is basically a separate function. Both work the same:

<pre><code>// 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 &lt;a&gt;
iterator.next() // second &lt;a&gt;
</code></pre>

The second one is almost identical to the first one, but is used a jQuery plugin instead:

<pre><code>// 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 &lt;a&gt;
iterator.next() // second &lt;a&gt;
</code></pre>

Javascript 1.7 has some cool features in <a href="https://developer.mozilla.org/en/New_in_JavaScript_1.7#Generators" rel="nofollow noreferrer">generators and iterators</a> for doing just this, but it's not still not widespread - only Firefox supports it as far as I know.

blocks|key|2989858|text|您使用的是:first，它将集合缩减为1，因此没有"next“。您可以尝试使用:first-child。|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|2989859|entityMap^0|5|6|13|C|0^^$0|@$1|2|3|4|5|6|7|H|8|@$9|I|A|J|B|C]|$9|K|A|L|B|C]]|D|@]|E|$]]|$1|F|3|-4|5|6|7|M|8|@]|D|@]|E|$]]]|G|$]]

You're using <code>:first</code>, which cuts the set down to one, so there is no "next". You could try using <code>:first-child</code> instead.

blocks|key|310344|text|在您的示例中，thisone.next()实际上应该什么也得不到，因为原始选择没有兄弟项(在同一级别)。您需要的是使用thisone.children("img")的thisone的子类，即img。|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|310345|entityMap^0|7|E|1N|N|2B|7|0^^$0|@$1|2|3|4|5|6|7|H|8|@$9|I|A|J|B|C]|$9|K|A|L|B|C]|$9|M|A|N|B|C]]|D|@]|E|$]]|$1|F|3|-4|5|6|7|O|8|@]|D|@]|E|$]]]|G|$]]

In your example <code>thisone.next()</code> should actually get nothing because there is no sibling (at the same level) to the original selection. What you want is the children of <code>thisone</code>, that is an img, using <code>thisone.children("img")</code>.

blocks|key|1058158|text|您的选择器应该是|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1058159|var+thisone+=+$("div.container+a.swaps:first");
var+img+=+thisone.children(img);|code-block|syntax|javascript|1058160|你的id也是无效的。id不能以数字开头。|1058161|entityMap^0|0|0|0^^$0|@$1|2|3|4|5|6|7|K|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|L|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|M|8|@]|9|@]|A|$]]|$1|I|3|-4|5|6|7|N|8|@]|9|@]|A|$]]]|J|$]]

Your selector should be

<pre><code>var thisone = $("div.container a.swaps:first");
var img = thisone.children(img);
</code></pre>

Also your id is invalid. You can't start an id with a number.

blocks|key|2990141|text|首先，我知道这不是你的代码，但是I永远不应该以数字开头或者只包含数字。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|2990142|我不确定你想做什么，但我认为如果你像这样遍历所有的.swaps会更容易：|offset|length|style|CODE|2990143|$('#container+.swaps').each(function(){
+var+swapImg+=+$(this).find('img');
+//+do+something+else
})|code-block|syntax|javascript|2990144|entityMap^0|0|P|6|0|0^^$0|@$1|2|3|4|5|6|7|O|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|P|8|@$D|Q|E|R|F|G]]|9|@]|A|$]]|$1|H|3|I|5|J|7|S|8|@]|9|@]|A|$K|L]]|$1|M|3|-4|5|6|7|T|8|@]|9|@]|A|$]]]|N|$]]

First off, I know it isn't your code, but IDs should never start with or only contain a number.

I'm not sure what you are trying to do, but I think it would be easier if you just iterate through all the <code>.swaps</code> like this:

<pre><code>$('#container .swaps').each(function(){
 var swapImg = $(this).find('img');
 // do something else
})
</code></pre>

I have bits of horrible code I have to deal with

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

If I use 

<code>var thisone = $("#container .swaps:first")</code> 

to select the first one (with id 1) why do I have trouble selecting 

<code>thisone.next()</code>?

jQuery's next() on elements not next to each other

翻译质量差，导致语言生硬或混乱。

没有提供实际的解决方法或示例。

解答不清晰，无法理解或解决问题。

页面排版不美观，阅读体验差。

文章

问答

视频

学习中心

腾讯云实验室

直播

竞赛

腾讯云代码分析专区

腾讯iOA零信任安全管理系统专区

腾讯云架构师技术同盟交流圈

腾讯云数据库专区

腾讯云顾问专区

腾讯云原生专区

腾讯混元专区

腾讯云TCE专区

腾讯云Lighthouse专区

腾讯云HAI专区

腾讯云Edgeone专区

腾讯云存储专区

腾讯云智能专区

腾讯轻联专区 

腾讯云开发专区

TAPD专区

腾讯轻量云游戏服专区

腾讯云最具价值专家

腾讯云架构师技术同盟

腾讯云创作之星

腾讯云开发者先锋

腾讯云代码助手

云原生构建

TAPD 敏捷项目管理

Cloud Studio

SDK中心

API中心

命令行工具

涵盖代码开发、场景应用、自动测试全流程，助你从零构建专属AI助手

一站式MCP教程库，解锁AI应用新玩法

我有一些可怕的代码需要处理...<div class="container"> ... <tr> <td width="100" height="50"> <a class="swaps"><img src="http://www.blah.jpg" alt="Some Title" id="1"></a></td> </tr> <tr>

问jQuery的next()对不相邻的元素
EN

回答 8

Stack Overflow用户

Stack Overflow用户

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问jQuery的next()对不相邻的元素EN

回答 8

Stack Overflow用户

Stack Overflow用户

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问jQuery的next()对不相邻的元素
EN