使用DOM nextSibling

Question

我正在寫它有這個HTML代碼塊頁面的userscript ..

<span id="mediaSetUfiLikeLink"> 
    <button class="like_link stat_elem as_link" title="Like this item" type="submit" name="like"> 
     <span class="default_message">Like</span> 
     <span class="saving_message">Unlike</span> 
    </button> 
</span> 

<span> 
    <a href="/ajax/sharer/?s=3&appid=2305272732&p[]=1012781954&p[]=2063763" rel="dialog">Share</a> 
</span> 

我需要一個id標籤添加到最後span塊。 （下一個）

<span> 
    <a href="/ajax/sharer/?s=3&appid=2305272732&p[]=1012781954&p[]=2063763" rel="dialog">Share</a> 
</span> 

我使用這個走到這一步，

document.getElementById("mediaSetUfiLikeLink").getElementsByTagName("span")[1]; 

我嘗試使用nextSibling這個樣子，這回得到最後spannull

document.getElementById("mediaSetUfiLikeLink").getElementsByTagName("span")[1].nextSibling; 

燦有人請幫我解決這個問題嗎？只是要再次明確，我想「獲得」到最後span塊，這樣我可以添加一個id屬性吧..

PS - 我需要使用jQuery做這個沒有或任何其他外部庫。純粹的JavaScript只。

謝謝

Answer 1

document.getElementById("mediaSetUfiLikeLink").nextElementSibling; 

或

function nextElementSibling(elem) { 

    do { 

     elem = elem.nextSibling; 

    } while(elem && elem.nodeType !== 1); 

    return elem; 
} 

var elem = nextElementSibling(document.getElementById("mediaSetUfiLikeLink")); 

http://jsfiddle.net/tXGQ6/

Answer 2

由於這是一個userscript功能的瀏覽器，你可以使用document.querySelector，像這樣：

var node = document.querySelector ("#mediaSetUfiLikeLink + span"); 

node.id = "myId"; 

​​。