javascript - jQuery:अगला तत्व ढूंढें जो एक भाई-बहन नहीं है




(3)

आप xpath का उपयोग कर सकते हैं:

document.evaluate('following::*[@class="x"], elt, null, XPathResult.ANY_TYPE, null);

या आप एक वॉकर का उपयोग कर सकते हैं:

var walker = document.createTreeWalker(elt, NodeFilter.SHOW_ELEMENT, function(node) {
    return node.classList.has('x');
});

while (walker.nextNode) {
    do_something_with(walker.currentNode);
}

मान लें कि मेरे पास HTML है:

<span>
    <span id="x1" class="x">X1</span>
</span>
<span>
    <span>
        <span id="x2" class="x">X2</span>
    </span>
</span>

और $(this) <span id="x1" ...>

JQuery के साथ अगला तत्व मिलान .x खोजने का सबसे अच्छा तरीका क्या है?
वास्तविक दस्तावेज़ की संरचना अप्रत्याशित है, इसलिए प्रदान किया गया HTML केवल एक उदाहरण है।

मैं nextAll उपयोग नहीं कर सकता क्योंकि यह केवल भाई-बहन पाता है।
अगर मैं $('.x') करता हूं, तो यह सभी को मिल जाता है, लेकिन मुझे इसका उपयोग करना होगा।
क्या कोई बेहतर समाधान है?

इसे भी देखें: http://jsfiddle.net/JZ9VW/1/


कक्षा x साथ सभी तत्वों का चयन करें, वर्तमान तत्व के सूचकांक की गणना करें और सूचकांक + 1 के साथ तत्व प्राप्त करें:

var $x = $('.x');
var $next = $x.eq($x.index(this) + 1);

यह काम करता है क्योंकि तत्वों को दस्तावेज़ क्रम में चुना जाता है। आपको केवल पृष्ठ लोड पर एक बार सभी .x तत्वों का चयन करना होगा (यदि वे गतिशील रूप से निर्मित नहीं हैं)।


आपके पास जो समस्या है, वह यह है कि आप Group Selector का उपयोग कर रहे हैं, जबकि आपको एक Multiples selector का उपयोग करना चाहिए! अधिक विशिष्ट होने के लिए, आप $('.a.b') $('.a, .b') का उपयोग कर रहे हैं जबकि आपको $('.a.b') का उपयोग करना चाहिए।

अधिक जानकारी के लिए, यहां चयनकर्ताओं को गठबंधन करने के विभिन्न तरीकों का अवलोकन देखें!

समूह चयनकर्ता: ","

सभी <h1> तत्वों और सभी <p> तत्वों और सभी <a> तत्वों का चयन करें:

$('h1, p, a')

गुणक चयनकर्ता: "" (कोई चरित्र नहीं)

कक्षा code और red साथ सभी <input> type text तत्वों का चयन करें:

$('input[type="text"].code.red')

Descendant चयनकर्ता: "" (अंतरिक्ष)

<p> तत्वों के अंदर <i> तत्वों का चयन करें:

$('p i')

बाल चयनकर्ता: ">"

सभी <ul> तत्वों का चयन करें जो <li> तत्व के तत्काल बच्चे हैं:

$('li > ul')

निकट भाई चयनकर्ता: "+"

<h2> तत्वों के तुरंत बाद रखे गए सभी <a> तत्वों का चयन करें:

$('h2 + a')

सामान्य भाई चयनकर्ता: "~"

सभी <span> तत्वों का चयन करें जो <div> तत्वों के भाई बहन हैं:

$('div ~ span')




javascript jquery