Question

我正在尝试在vanila javascript中实现以下功能

$('#myElement').next('a').length > 0

目前我正处于现阶段

document.getElementById('myElement').nextSibling.length > 0

但是我需要在<a>之后专门检查是否有一个带有.item类的锚标记#myDiv，因为它可以也可以不是一个，我需要应用特定的样式来每种情况都#myDiv。

Answer 1

您可以执行以下操作：

document.getElementById('myElement').nextElementSibling.tagName == 'A'

请务必使用nextElementSibling，而不是nextSibling，以便能够检查代码名称。

见这里：

console.log(check('myElement'));
console.log(check('almostRightElement'));
console.log(check('rightElement'));
console.log(check('noSiblings'));

function check(id){
  var el = document.getElementById(id).nextElementSibling;
  return !!el && el.tagName == 'A' && el.className == 'item';
  /* 
     used !!el just to make the check function always return a boolean
     it is not necessary as nextElementSibling will return null if
     no element is found, and since null is falsy, it will break the chain anyway
  */ 
}

<div>
  <div id="myElement"></div>
  <div></div>
</div>
<div>
  <div id="almostRightElement"></div>
  <a></a>
</div>
<div>
  <div id="rightElement"></div>
  <a class="item"></a>
</div>
<div>
  <div id="noSiblings"></div>
</div>

使用vanila javascript复制jQuery的.next（'a'）

1 个答案: