將祖先選擇器添加到此javascript

有沒有簡單的方法可以添加一些關於將祖先li標籤設置爲.active的一些信息？將祖先選擇器添加到此javascript

<script language="javascript" type="text/javascript"> 
function setActive() { 
    aObj = document.getElementById('toc').getElementsByTagName('a'); 
    for(i=0;i<aObj.length;i++) { 
    if(document.location.href.indexOf(aObj[i].href)>=0) { 
     aObj[i].className='active'; 
    } 
    } 
} 
window.onload = setActive; 
</script>

來源

2011-07-15 bgadoci

這取決於你的意思。我無法全面瞭解您的問題。從外觀上看，你抓取了一個id爲「toc」的元素，所以我猜這個toc包含LI元素以及A元素。在這種情況下，您可以在getElementsByTagName中使用星號，這可能會更慢，具體取決於其中有多少其他元素。

function setActive() { 
    var href = window.location + '' 
    , el = document.getElementById('toc') 
    , a = el.getElementsByTagName('*') 
    , i = 0 
    , l = a.length 
    , name; 

    for (; i < l; i++) { 
    el = a[i]; 
    name = el.nodeName.toLowerCase(); 
    if (name === 'li' || (name === 'a' 
     && ~href.indexOf(el.href))) { 
     el.className = 'active'; 
    } 
    } 
}

如果你問祖李上漲文檔樹，這是你想要什麼：

function setActive() { 
    var href = window.location + '' 
    , el = document.getElementById('toc') 
    , a = el.getElementsByTagName('a') 
    , i = 0 
    , l = a.length; 

    // descendants 
    for (; i < l; i++) { 
    if (~href.indexOf(a[i].href)) { 
     a[i].className = 'active'; 
    } 
    } 

    // parents 
    while (el = el.parentNode) { 
    if (el.nodeName.toLowerCase() === 'li') { 
     el.className = 'active'; 
    } 
    } 
}

來源

2011-07-15 05:28:48 chjj

步行element.parentNode檢查tagName.toLowerCase() == "li"識別父<li>。然後設置className = "active"。

var parent = aObj[i].parentNode; 
while (parent && parent.tagName.toLowerCase() != "li") 
    parent = parent.parentNode; 
if (parent) parent.className = "active";

來源

2011-07-15 05:18:32 gilly3

我沒有測試過或任何東西，但我認爲這會工作：

<script language="javascript" type="text/javascript"> 
function setActive() { 
    aObj = document.getElementById('toc').getElementsByTagName('a'); 
    for(i=0;i<aObj.length;i++) { 
    if(document.location.href.indexOf(aObj[i].href)>=0) { 
     aObj[i].className='active'; 
    } 
    var node = aObj[i]; 
    while(document != (node = node.parentNode)){ 
     if(node.tagName.toLowerCase() == 'li') 
     node.className='active'; 
    } 
    } 
} 
window.onload = setActive; 
</script>

來源

2011-07-15 05:18:35 Paulpro

將祖先選擇器添加到此javascript

回答

相關問題