使用jquery获取div中的下一个元素

假设我们有这个HTML代码

 
Title
 
lorem ipsum
  

而这个jQuery

 $("#test h2").text("Changed Title"); 

现在，继续下到

并更改文本的正确方法是什么，而不是上升到一个级别。 就像next()只会寻找下一个h2，但是有些东西可以使兄弟姐妹独立于元素类型。 像next("p"); 也许？

Answer 1

next选择下一个元素：默认情况下，它不仅选择相同类型的元素。

 $('#test h2').next(); // selects the p $('#test h2').next('p'); // selects the p $('#test h2').next('h2'); // does not select the p 

除非您提供选择器，否则next 将选择下一个兄弟元素。 你可以这样做：

 $('#test h2').text('Changed title').next().text('Changed text'); 

Answer 2

你要找的命令是siblings("p")

这是你的例子，更新：

 $("#test h2").text("Changed Title").siblings('p').text('test'); 

Answer 3

.next( 'p' )会做到这一点：

 $("#test h2").text("Changed Title") .next( 'p' ) .text( 'Another change' ); 

来自jQuery文档 ：

获取匹配元素集中每个元素的紧随其后的兄弟。 如果提供了选择器，则仅当它与该选择器匹配时，它才会检索下一个兄弟。

请参见示例小提琴 。

Answer 4

.next('p')确实有效。 最后将它链接起来。 像这样：

$('#test h2').text("Changed Title").next('p').text('I changed too');

Answer 5

 $("#test h2").text("Changed Title").siblings().text(""); 

Answer 6

就像你的建议，

 $("#test").next("p").text('yada'); 

甚至更好：

 $("#test h2").text("Changed Title").next("p").text('yada'); 

Answer 7

确切地说，您可以使用.next('p')方法来完成：

 $("#test h2").next('p').text("...");