क्या एचटीएमएल

Question

में एक निश्चित स्ट्रिंग के साथ शुरू होने वाले गुणों की खोज करने का कोई तरीका है क्या किसी विशेष स्ट्रिंग से शुरू होने वाले गुणों वाले सभी तत्वों को ढूंढने का कोई तरीका है?

मैं Mootools ढांचे का उपयोग कर रहा है और इस मैं क्या करने की कोशिश की है:

$$('*[data-media-*]'); 

लेकिन यह केवल पृष्ठ में सभी तत्वों को आउटपुट।

तो क्या पृष्ठ में सभी तत्व प्राप्त करने का कोई तरीका है जिसमें data-media- से शुरू होने वाले गुण हैं?

Answer 1

आप उन तत्वों को फ़िल्टर कर सकते हैं जिन्हें आप पहले से ही मेल खाने वाले डेटा- * विशेषताओं के साथ लौटाना चाहते हैं।

Elements.implement({ 
    filterData: function(substring){ 
     return this.filter(function(element){ 
      var attribs = element.attributes, 
       len, 
       ii = 0; 

      for (len = attribs.length; ii < len; ++ii) { 
       if (attribs[ii].name.indexOf('data-') === 0 && attribs[ii].name.indexOf(substring) !== -1) { 
        return true; 
       } 
      } 
     }); 

    } 
}); 

console.log($$("div").filterData('foo')); 
console.log($$("div").filterData('bar')); 
console.log($$("div").filterData('oba')); 

कार्रवाई में

: http://jsfiddle.net/dimitar/pgZDw/

नकारात्मक पक्ष यह है: आप पहले से ही तत्व है, जो निरर्थक, जैसे का एक संग्रह पर इसे पारित करने की जरूरत है। div।foo या #someid *

एक और अधिक सुरुचिपूर्ण समाधान एक :data() छद्म को स्लिक जोड़ने के लिए होगा:

(function(){ 
    // cache reusable string 
    var data = 'data', 
     hyphen = '-', 
     // set the fallback via XMLSerializer, if no outerHTML (eg. FF 2 - 10) 
     XS = this.XMLSerializer && new XMLSerializer(); 

    Slick.definePseudo(data, function(value){ 
     return (this.outerHTML || XS.serializeToString(this)).test([data, value].join(hyphen)); 
    }); 
}()); 


console.log($$("div:data(foo)")); 
console.log($$(":data(media-)")); 

अद्यतन उदाहरण: http://jsfiddle.net/dimitar/pgZDw/3/

Answer 2

$$('div[attrName="attrnameValue"]').each(function() { 
    // `this` is the div 
}); 

Answer 3

आप कंटेनर में प्रत्येक तत्व के लिए गुण के माध्यम से पुनरावृत्ति, और क्या विशेषता नाम के लिए आप क्या देख रहे हैं के लिए एक regex से मेल खाता देख कर कुछ इस तरह का अनुमान लगा सकता:

उदाहरण के लिए, in this jsFiddle, I am looking for li elements with the data-media-tv and data-media-dvd properties।

आप रेगेक्स को केवल वही लौटने के लिए तैयार कर सकते हैं जो आप देखना चाहते हैं। केवल उन तत्वों को देखना चाहते हैं जिनमें डेटा-मीडिया- * (जैसे आपके प्रश्न में) है? Here you go।

---

ध्यान रखें कि इस वास्तव में स्केलेबल नहीं है। चूंकि हम पृष्ठ पर प्रत्येक तत्व के माध्यम से पुनरावृत्त कर रहे हैं, और प्रत्येक एकल विशेषता की जांच कर रहे हैं (लेकिन यदि पाया जाता है तो जल्दी लौट रहा है), यह संभवतः बड़े पृष्ठों के लिए धीमा हो सकता है और संभवतः होगा।

इसे केवल उस कंटेनर तक सीमित करें जिसे आप खोजना चाहते हैं, या केवल वे तत्व जिन्हें आप पुन: सक्रिय करना चाहते हैं! यदि आप इसे document.body के विरुद्ध चलाते हैं, तो यह पृष्ठ में प्रत्येक तत्व के माध्यम से फिर से शुरू हो जाएगा, यदि परिणामस्वरूप आपका घर जल जाए तो मैं ज़िम्मेदार नहीं होगा। :)

---

यहाँ यह समारोह-ized है:

function attrMatch(elements, regexp) { 
    // Iterate through all passed-in elements, return matches 
    var matches = elements.filter(function(li) { 
    var numAttr = li.attributes.length; 
    for(x=0;x<numAttr;x++) { 
     var attr = li.attributes[x]; 
     return attr['name'].test(regexp); 
    } 
    }); 

    return matches; 
}; 

elements में, केवल तत्वों आप जाँच करना चाहते हैं में पारित, संभवतः $$ के माध्यम से चयन किया। यदि आप कंटेनर तत्व में सभी तत्वों को देखना चाहते हैं, तो ऊपर element के प्रत्येक उदाहरण में elementscontainer और container.getChildren() के साथ प्रतिस्थापित करें।

Answer 4

कोशिश this jsfiddle बस (सामान्य) सूचकांक/स्थिति पता विशेषता data-media-* और तदनुसार कोड में उपयोग करें।