Добавление селектора предков в этот javascript

Есть ли простой способ добавить немного о настройке предка li теги к.active?

<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>

3 ответа

Решение

Смотря что ты имеешь в виду. Я не получаю полную картину того, что происходит из вашего вопроса. Судя по всему, вы получаете элемент с идентификатором "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';
    }
  }
}

Если вы просите наследственный LI выше в дереве документов, это то, что вы хотели бы:

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';
    }
  }
}

Ходить 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";

Я не проверял это или что-нибудь, но я думаю, что это будет работать:

<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>
Другие вопросы по тегам