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を更新しました。

4

2 に答える 2

3

それは問題なく動作し、非常に明確でまっすぐ進んでいます。改善できる唯一のことは、各クラスの前にドットを追加することです。

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

これがライブデモです：http：//jsfiddle.net/cdWXN/1/

于 2012-05-12T11:51:24.967 に答える
1

それはうまく機能します、私はいくつかのテストを実行しました、そしてどれもあなたの現在の方法を改善することができませんでした。

gion_13による提案に加えて、要素を表示する順序を逆にすることをお勧めします。

目標によっては、 .reverse（）を使用することで、HTMLからクリックされた要素までの読みやすさが向上する場合があります。

$(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);
});

ここにフィドルの例があります！

于 2012-05-12T12:06:56.717 に答える