从DOM中选择元素,它不是所选e的兄弟

时间:2016-08-15 19:16:24

标签: javascript jquery dom

我选择了span元素,我想要遍历input:checkbox。我尝试过使用next()nextAll()nextElementSibling。但由于input元素不是span的兄弟,因此无效。我可以选择输入元素吗?

以下是我的代码:

<span>This element is selected via javascript</span>

<div>
  <a href="some link"></a>
</div>


<div class="mb_content">
  5 attachement
  <br />
  <span class="error_star mr_1"><b>Size:5 MB</b></span>
</div>

<div class="checker f_left">
  <label for="rec_787128222">&nbsp;</label>
  <input type="checkbox" class="mb_check" /><!--i want to select this-->
</div>

PS:实际结构有点不同,但我不能将其粘贴在这里。这是它的复制品。

2 个答案:

答案 0 :(得分:1)

如果您真的想使用nextSibling() ...

var el  = document.querySelector("#foo").nextSibling.nextSibling.nextSibling.nextSibling.nextSibling.nextSibling.children[1];

el.style.display = 'none';
<span id="foo">This element is selected via javascript</span>

<div>
  <a href="some link"></a>
</div>


<div class="mb_content">
  5 attachement
  <br />
  <span class="error_star mr_1"><b>Size:5 MB</b></span>
</div>

<div class="checker f_left">
  <label for="rec_787128222">&nbsp;</label>
  <input type="checkbox" class="mb_check" />
  <!--i want to select this-->
</div>

答案 1 :(得分:-1)

如果不对null进行任何检查,您可以尝试:

document.querySelectorAll('.error_star.mr_1')[0].parentNode.nextElementSibling.children[1];