पुस्तकालयों के बिना जावास्क्रिप्ट में भाई बहनें

Question

मैं जावास्क्रिप्ट का उपयोग करके भाई बहनों को "ऊपर" कैसे देख सकता हूं? असल में, मुझे jQuery में मौजूद एक के समान prevUntil() फ़ंक्शन की आवश्यकता है।

<div></div> 
<div></div> 
<div></div> 
<div></div> 
<div></div> 
<div></div> 

मैं एक क्लिक किए गए तत्व पर शुरू होते हैं और अपने रास्ते एक ही है कि एक वर्ग से मेल खाता है जब तक भाई बहन पेड़ पर काम करना चाहते हैं:

मैं इस तरह के रूप <div> तत्वों, एक ही स्तर पर सभी के बहुत सारे है, नाम मानदंड तक पहुंच गया है, फिर बंद करो।

मैं यह कैसे कर सकता हूं, कृपया?

Answer 1

यह उत्तर पहले इसी प्रश्न के जवाब में here प्रकाशित हुआ था।

ऐसा करने के कुछ तरीके हैं।

इनमें से किसी एक को चाल चलनी चाहिए।

// METHOD A (ARRAY.FILTER, STRING.INDEXOF) 
var siblings = function(node, children) { 
    siblingList = children.filter(function(val) { 
     return [node].indexOf(val) != -1; 
    }); 
    return siblingList; 
} 

// METHOD B (FOR LOOP, IF STATEMENT, ARRAY.PUSH) 
var siblings = function(node, children) { 
    var siblingList = []; 
    for (var n = children.length - 1; n >= 0; n--) { 
     if (children[n] != node) { 
      siblingList.push(children[n]); 
     } 
    } 
    return siblingList; 
} 

// METHOD C (STRING.INDEXOF, ARRAY.SPLICE) 
var siblings = function(node, children) { 
    siblingList = children; 
    index = siblingList.indexOf(node); 
    if(index != -1) { 
     siblingList.splice(index, 1); 
    } 
    return siblingList; 
} 

FYI करें: jQuery कोड आधार ग्रेड ए जावास्क्रिप्ट के अवलोकन के लिए एक महान स्रोत है।

यहां एक उत्कृष्ट उपकरण है जो jQuery कोड-बेस को एक बहुत सुव्यवस्थित तरीके से प्रकट करता है। http://james.padolsey.com/jquery/

Answer 2

वहाँ HTML डोम

यहाँ में एक previousSibling संपत्ति है कुछ संदर्भ

http://reference.sitepoint.com/javascript/Node/previousSibling

Answer 3

बस how jQuery does it पर एक नज़र है।

prevUntil: function(elem, i, until) { 
    return jQuery.dir(elem, "previousSibling", until); 
}, 

जो थोड़ी देर/लूपिंग फ़ंक्शन का उपयोग करता है dir()। पिछली बार previousSibling तक चलती रहती है until तत्व के समान होती है।

dir: function(elem, dir, until) { 
    var matched = [], 
     cur = elem[ dir ]; 

    while (cur && cur.nodeType !== 9 && (until === undefined || cur.nodeType !== 1 || !jQuery(cur).is(until))) { 
     if (cur.nodeType === 1) { 
      matched.push(cur); 
     } 
     cur = cur[dir]; 
    } 
    return matched; 
}, 

Answer 4

उपयोग .children.parentNode के साथ संयोजन में। फिर इसे NodeList फ़िल्टर करें, इसे किसी सरणी में परिवर्तित करने के बाद: http://jsfiddle.net/pimvdb/DYSAm/।

var div = document.getElementsByTagName('div')[0]; 
var siblings = [].slice.call(div.parentNode.children) // convert to array 
       .filter(function(v) { return v !== div }); // remove element itself 
console.log(siblings); 

Answer 5

Example का उपयोग previousSibling:

var className = "needle"; 
    var element = clickedElement; 
    while(element.previousSibling && element.previousSibling.className != className) { 
     element = element.previousSibling; 
    } 
    element.previousSibling; // the element or null 

Answer 6

कैसे इस बारे में:

while (node = node.previousElementSibling) { 
    if ((' ' + node.className + ' ').indexOf('foo') !== -1) { 
     // found; do your thing 
     break; 
    } 
} 

मुझे बता कि इस IE8 में काम नहीं करता है परेशान न हों ...

Answer 7

आपको मूल रूप से GetElementsByTagName मिल गया है और getElementsByName वे एरे वापस करते हैं और जंगली कार्ड का उपयोग कर सकते हैं। यदि आप चाहते हैं कि आपको कोई फ़ंक्शन बनाने या किसी लाइब्रेरी की तरह पहले से मौजूद किसी चीज़ का उपयोग करने की आवश्यकता न हो।

function getElements() 
    { 
    var x=document.getElementsByName("*"); 
    alert(x.length); 
    } 

अद्यतन

getElementByID सिर्फ एक तत्व देता है।