Javascript JQUERY：在复杂结构中查找下一个元素的混乱

在获取复杂结构中的下一个元素时，我感到非常困惑

复杂结构：

<p>before data</p>

<div>
   <p>some data <span id="getnext"></span></p>
</div>    

<div>
    <p>some data <span><ins>inserted</ins></span></p>
</div>    

<div>
   <div>
      <p>some data <span><del>deleted</del></span></p>
   </div>
</div>   

<div>
   <div>
       <ol>
             <li>Some changes made<span data-change="get">in this place</span></li>
       </ol>    
   </div>
</div>

<p>some data <span id="getnext"></span>extra data<ins>some data</ins></p>

<p>deleted<span><del>some data</del></span> data</p>

<ol>
  <li><ins>list insert</li>

  <ul>
     <li><del>deleted</del></li> 
  </ul>

</ol>

<div>
  <p><span data-change="get">changed data</span>
</div>

但是，这不太管用。我现在该怎么办

有什么想法或建议吗

最大结构变量：

<p>before data</p>

<div>
   <p>some data <span id="getnext"></span></p>
</div>    

<div>
    <p>some data <span><ins>inserted</ins></span></p>
</div>    

<div>
   <div>
      <p>some data <span><del>deleted</del></span></p>
   </div>
</div>   

<div>
   <div>
       <ol>
             <li>Some changes made<span data-change="get">in this place</span></li>
       </ol>    
   </div>
</div>

<p>some data <span id="getnext"></span>extra data<ins>some data</ins></p>

<p>deleted<span><del>some data</del></span> data</p>

<ol>
  <li><ins>list insert</li>

  <ul>
     <li><del>deleted</del></li> 
  </ul>

</ol>

<div>
  <p><span data-change="get">changed data</span>
</div>

一些数据额外的数据一些数据

删除某些数据

列表插入

已删除

更改的数据

您需要先转到最近的

分区

$('#getnext').closest( "div" );

然后检查
下一个
div
元素，该元素具有子
ins
，
del
等

$('#getnext').closest( "div" ).nextAll( "div:has(ins,del,span[data-change='get'])" );

或

演示


var输出=$（'#getnext'）.nextest（“div”）.nextAll（“div:has（ins，del，span[data change='get']）；
console.log（output.length）

数据之前

一些数据

插入一些数据

删除了一些数据

这里发生了一些变化
您需要先转到最近的
分区

$('#getnext').closest( "div" );

然后检查
下一个
div
元素，该元素具有子
ins
，
del
等

$('#getnext').closest( "div" ).nextAll( "div:has(ins,del,span[data-change='get'])" );

或

演示


var输出=$（'#getnext'）.nextest（“div”）.nextAll（“div:has（ins，del，span[data change='get']）；
console.log（output.length）

数据之前

一些数据

插入一些数据

删除了一些数据

这里发生了一些变化
$（'getnext'）
没有同级。使用
$（'#getnext'）.parent（）.next（'div-ins，div-del，div-span[…]）
可以，但结构每次都会改变。我只有
$（'#getnext'）
作为一个稳定的id。那么我该怎么办？@Rajesh
$（'#getnext'）。parent（）
也没有任何兄弟姐妹。@gurvinder372我的意思是
div。您可以尝试
$（'#getNext'）。最近（'div'）。next（…）
$（'#getNext'）
没有同级。使用
$（'#getnext'）.parent（）.next（'div-ins，div-del，div-span[…]）
可以，但结构每次都会改变。我只有
$（'#getnext'）
作为一个稳定的id。那么我该怎么办？@Rajesh
$（'#getnext'）。parent（）
也没有任何兄弟姐妹。@gurvinder372我的意思是
div。你可以试试
$（'#getNext'）。最近的（'div'）。next（…）
好的，但是结构每次都会改变。我只有
$（'#getNext'）
作为一个稳定的id。那么我该怎么办？在这种情况下，我不确定我能帮什么忙，除非你能告诉我你的结构在.kk中的变化范围，我将放置最大结构变量。@MariSelvan还将尝试我与您的结构的不同变体共享的代码。好的，我将尝试。谢谢。好的，但结构每次都会更改。我只有
$（“#getnext”）
作为一个稳定的id。那么我该怎么办呢？在这种情况下，我不知道我能帮什么忙，除非你能告诉我你的结构的变化范围。kk，我将设置最大结构变量。@MariSelvan还可以尝试我与你的结构的不同变量共享的代码。好的，我会尝试。谢谢