JavaScript等同於JQuery .next（）

是否有類似於jQuery .next（）的JavaScript方法？我想查找具有相對於元素的「錯誤」類的下一個元素。我試過使用.nextSibling作爲循環，但無法弄清楚。不知道是否有沒有更容易的方式去沒有jQuery。JavaScript等同於JQuery .next（）

舉例來說，如果我有這樣的代碼：

<div id="section"> 
    <div id="test">test</div> 
    <span class="info">Information</span> 
    <span class="error">Error!</span> 
</div>

我試圖讓最接近的下一個.error類#test，如果我有一個#section2和#test2我希望得到.error類最接近#test2等。

來源

2013-12-17 Howdy_McGee

我懷疑你可能誤會了什麼'。接下來（選擇）'確實。它不通過兄弟姐妹來匹配選擇器。它只是過濾，要麼收集下一個兄弟姐妹，如果它匹配或沒有。 –

這是你的純JavaScript：

HTML

<div id="nodes"> 
    <div class="error">This is error Node</div> 
    <div class="nextElement">This is next Element</div> 
</div>

Javscript：

var nodes = Array.prototype.slice.call(document.getElementById('nodes').children), 
    errorNode = document.getElementsByClassName('error')[0]; 
var indexOfError = nodes.indexOf(errorNode); 
var nextElement = nodes[indexOfError + 1]; 
alert(nextElement.innerText);

這裏是demo

來源

2013-12-17 03:26:04 HICURIN

最好的辦法是搜索jQuery代碼，看看他們做了什麼。 http://code.jquery.com/jquery-2.0.3.js

一眼就看到了一些對「nextSibling」和「previousSibling」的調用。

而且在這裏看到： How to get next element using JavaScript-only?

希望這有助於！

來源

2013-12-17 03:13:05 kmiklas

聽起來像你可能正在尋找document.getElementsByClassName() ...如果class = error的元素不是DOM中的直接兄弟，那麼沒有好的方法來找到它們。這是基本的，但是您可以搜索document.getElementsByClassName('error')返回的數組，直到找到您的起始元素，然後您知道數組中的下一個項目將成爲DOM中的下一個元素。請參閱MDN reference。不適用於舊版IE，但適用於所有現代瀏覽器。

來源

2013-12-17 03:17:06 Hylianpuffball

JavaScript等同於JQuery .next（）

回答

相關問題