4

次のマークアップがあるとします。

<div class="hello">
  <p>
    <a href="#"><span id="start">Start</span></a>
  </p>
</div>

$('#start')DOM ツリーを上って、クラス属性を持つ最も近い要素を見つける方法はありますか?

明確化: 実際には、$('#start') から $(.hello) までの完全なパスを含む文字列を取得する必要があります。これには、上記のマークアップに基づいて So までのすべての要素のタグ名が含まれます。出力は次のようになります。 「スパン ap .hello

要素のタグ名は次のように取得できますelement.prop('tagName')

4

3 に答える 3

10

どうですか

$('#start').closest("[class]");
于 2013-05-15T13:23:11.573 に答える
8

で開始したものを含め、最も近い要素が必要な場合は、次を使用し.closestます。

$('#start').closest('[class]');

開始要素を除外する場合は、次を使用します。

$('#start').parents('[class]').first();

一致する完全なパスを取得するには、次を試してください。

var path = [];
var el = document.getElementById('start');
while (el) {
    if (el.className) {
        path.push('.' + el.className);
        break;
    } else {
        path.push(el.tagName);
    }
    el = el.parentNode;
}
var ancestors = path.join(' ');

http://jsfiddle.net/alnitak/EZWNR/を参照してください。

私がネイティブ JS を使用したのは、jQuery が要素そのすべての祖先を選択する簡単な方法を提供していないためです。

于 2013-05-15T13:26:39.507 に答える
4

jQuery の: Demoを使用してクラスを持つ文字列に遭遇するまで、親ノード名を含む文字列を取得できます。parents()

var path = 'span ';
$('#start').parents().each(function() {
    if($(this).is('[class]')) {
        path += '.' + this.className + ' ';
        return false; // break
    }
    else {
        path += this.nodeName + ' ';
    }
});
console.log(path);

はい、次のことができます。

$('#start').closest("[class]");
于 2013-05-15T13:23:35.247 に答える