2012-05-12 2 views
0

Чтобы получить имена всех родительских элементов?Есть ли лучший способ получить имена всех родительских элементов?

$(document).on('click', function(e){ 
    var parents = $(e.target).parents().map(function(){ 
     var $this = $(this), 
      $id = $this.prop('id') ? '#'+$this.attr('id') : '', 
      $class = $this.prop('class') ? '.'+$this.attr('class') : ''; 
     return this.tagName.toLowerCase()+$id+$class; 
     }).get().join(" < "); 
    prompt('The path to the element, Luke:',parents); 
}); 

FIDDLE с примером.

EDIT: Ницца! Спасибо, парни! Обновлено FIDDLE.

+0

Почему вы хотите другой способ получить весь родитель элементы ?? Твой путь не работает? : \ – elboletaire

+0

Всегда есть лучший способ, даже мои пути идут правильно;) –

ответ

1

Он хорошо работает, я запустить несколько тестов, и никто не должен улучшить текущий метод.

В дополнение к предложению, предоставленному gion_13, я предлагаю обратить вспять порядок отображения элементов!

В зависимости от вашей цели, он может иметь лучшую читаемость от HTML до щелкнул элемент, с помощью .reverse():

$(document).on('click', function(e){ 
    var parents = $(e.target).parents().map(function(){ 

    var $this = $(this), 
     $id = $this.prop('id') ? '#'+$this.attr('id') : '', 
     $class = $this.prop('class') 
        ? '.'+$.trim($this.attr('class')).replace(/\s+/g,'.') 
        : ''; 

    return this.tagName.toLowerCase()+$id+$class; 

    }).get().reverse().join(" > "); 

    prompt('The path to the element, Luke:',parents); 
}); 

скрипку примера here!

3

Он работает нормально, и это совершенно ясно & прямо вперёд. Единственное, что вы могли бы улучшить добавляет точку перед каждым классом:

$class = $this.prop('class') 
      ? '.'+$.trim($this.attr('class')).replace(/\s+/g,'.') 
      : ''; 

Вот демо: http://jsfiddle.net/cdWXN/1/