कुछ एचटीएमएल विशेषताओं को कैसे प्राप्त करें जो कुछ (प्रारंभिक नाम, * नहीं * उनके मूल्य!)

मैं एक HTML पृष्ठ में सभी तत्व/नोड्स प्राप्त करना चाहता हूं जिसमें कुछ ऐसा प्रारंभ होता है जो दोबारा शुरू होता है (फिर से, विशेषता नाम कुछ के साथ शुरू होते हैं, न कि उनके मूल्य!)। उदाहरण के लिए, TinyMCE में "mce_style", "mce_href", "mce_bogus" इत्यादि जैसे तत्वों को कस्टम विशेषताओं को जोड़ने की प्रवृत्ति है। मैं विशेषता मानों के लिए CSS3 चयनकर्ता की तरह कुछ करना चाहता हूं, [attr^="mce_"], लेकिन मानों के लिए नहीं, विशेषता नाम।कुछ एचटीएमएल विशेषताओं को कैसे प्राप्त करें जो कुछ (प्रारंभिक नाम, * नहीं * उनके मूल्य!)

बेशक, मैं सभी डोम नोड्स और उनके गुणों के माध्यम से पुन: प्रयास कर सकता हूं और उन्हें एक-एक करके जांच सकता हूं, लेकिन मैं सोच रहा था कि कोई और अधिक प्रभावी तरीका है या नहीं।

कृपया मुझे TinyMCE- विशिष्ट उत्तरों न दें, मुझे पूरा यकीन है कि एक ध्वज है जो इन विशेषताओं को सहेजने के लिए TinyMCE को रोक देगा, लेकिन सवाल सामान्य है।

स्रोत

2012-04-25 AsGoodAsItGets

मुझे यह महसूस हो रहा है कि आपको या तो प्रत्येक तत्व के माध्यम से पुनरावृत्ति करना होगा, और प्रत्येक विशेषता को देखें। यहां तक कि 'document.querySelectorAll()' में 'विशेषता-नाम-शुरू-के साथ' विकल्प नहीं है। दिलचस्प सवाल –

मुझे TinyMCE के बारे में कुछ भी पता नहीं है, लेकिन यदि तत्वों की पहचान करने का कोई तरीका है जिसमें * कोई * ऐसी विशेषता है तो आप कम से कम अपनी खोज को सबसेट में संकीर्ण कर सकते हैं, फिर सबसेट की प्रत्येक विशेषता को देखें, जो होगा पूरे डोम को देखने से बहुत तेज़। यही है, क्या कुछ विशेषता है जो हमेशा आपके लक्ष्यों में से एक में जोड़ दी जाएगी? यदि ऐसा है तो पहले उस के लिए देखो। –

@jamietre हाँ, जहां तक TinyMCE का संबंध है, आप उदास कर सकते हैं उदा। कि 'mce_href' हमेशा' ए' तत्वों पर लागू होगा, ताकि आप अपनी खोज को सीमित कर सकें। लेकिन जैसा कि मैंने अंतिम वाक्य में कहा था, मैं TinyMCE- विशिष्ट उत्तरों की तलाश नहीं कर रहा हूं, मेरे पास एक सामान्य समाधान होगा, और अब तक के उत्तरों से निर्णय लेना, सभी तत्वों के माध्यम से पुन: प्रयास करने का कोई दूसरा तरीका नहीं है और उनके गुण। Pitty। – AsGoodAsItGets

-1

इस प्रयास करें: (मैं डालने की कोशिश की * a टैग के बजाय लेकिन यह जो mce_style रूप में अच्छी तरह का श्रेय नहीं है उन सहित सभी तत्वों के रंग का)

a[mce_style] { color : red; }

डेमो: http://jsfiddle.net/Tcdmb/

और जानकारी: https://developer.mozilla.org/en/CSS/Attribute_selectors

स्रोत

2012-04-25 10:16:28 codef0rmer

आप सवाल फिर से पढ़ना चाहते हैं ... – McGarnagle

ठीक है। यह कुछ हद तक उसकी समस्या हल करता है लेकिन 'mce_ *' में * या% का उपयोग नहीं कर सकता है ताकि सभी तत्वों को 'mce_' के साथ उपसर्ग के रूप में विशेषता हो। – codef0rmer

here's a simple demomce_ से शुरू होने वाली विशेषता वाले सभी तत्वों को ढूंढने के लिए। कुछ परिशोधन की आवश्यकता हो सकती है।

function getMCE() { 
    var el, attr, i, j, arr = [], 
     reg = new RegExp('^mce_', 'i'),    //case insensitive mce_ pattern 
     els = document.body.getElementsByTagName('*'); //get all tags in body 

    for (i = 0; i < els.length; i++) {     //loop through all tags 
     el = els[i]         //our current element 
     attr = el.attributes;       //its attributes 
     dance: for (j = 0; j < attr.length; j++) {  //loop through all attributes 
      if (reg.test(attr[j].name)) {    //if an attribute starts with mce_ 
       arr.push(el);       //push to collection 
       break dance;       //break this loop 
      } 
     } 
    } 
    return arr; 
} 

console.log(getMCE())

स्रोत

2012-04-25 11:06:05 Joseph

हाँ, यह स्पष्ट समाधान है, सभी तत्वों और उनके गुणों के माध्यम से पुनरावृत्ति, जो कि बड़े डीओएम के लिए बहुत महंगा है। 'ब्रेक डांस' के लिए – AsGoodAsItGets

+1: डी –

-1 'ब्रेक डांस' के लिए -1 क्योंकि यह मेल खाने वाले तत्व की पहली विशेषता को तोड़ देगा। एक तत्व में कई मिलान करने वाले गुण हो सकते हैं। लेकिन कुल मिलाकर उपरोक्त कोड इस समय एकमात्र समाधान प्रतीत होता है। – AsGoodAsItGets

इस प्रयास करें:

कार्य

//custom selector expression 
$.extend($.expr[':'],{ 
attr:function(o,i,m){ 
    var attrs=$.getAttrAll(o),re=m[3],found=false; 
    $.each(attrs,function(k,v){ 
    if(new RegExp(re).test(v)) { return found=true;} 
}); 
return found; 
} 
}); 
// get all atrributes of an element 
$.getAttrAll=function(el){ 
    var rect = []; 
    for (var i=0, attrs=el.attributes, len=attrs.length; i<len; i++){ 
    rect.push(attrs.item(i).nodeName); 
    } 
    return rect; 
};

` उपयोग

// calling custom selector expression :attr(regexp) 
$(function(){ 
    $('body').find(':attr("^mce_")').css({background:'yellow'}); 
});

एचटीएमएल

<body> 
    <p mce_style="height:50px" id="x" data-hello="hello">selected</p> 
    <div not_mce_bogus="abc">not_mce_bogus</div> 
    <div mce_href="http://rahenrangan.com">selected</div> 
    <p>othrs</p> 
</body>

स्रोत

2012-04-25 13:08:50

यह मूल रूप से थोड़ा अधिक सुरुचिपूर्ण है लेकिन मुझे नीचे यूसुफ द्वारा पोस्ट किए गए कोड का थोड़ा कम प्रदर्शन करने वाला, jQuery-आधारित पुनर्लेखन पर संदेह है। इसे अभी भी प्रत्येक तत्व और डीओएम के माध्यम से प्रत्येक विशेषता के माध्यम से जाना है। और भी, आपके द्वारा उल्लिखित उदाहरण उपयोग केवल शरीर टैग के तत्काल बच्चों पर विचार कर रहा है, सही उपयोग 'बच्चों()' के बजाय 'ढूंढें()' के साथ होगा (हालांकि आपके सरल HTML में यह काम करेगा)। मुझे लगता है कि मुझे इस तथ्य के साथ रहना होगा कि ऐसा करने का कोई बेहतर तरीका नहीं है। – AsGoodAsItGets

या आप आर rite। धन्यवाद –

एक विकल्प है, अगर आप अस्थायी रूप से कोई आपत्ति नहीं है अपने डोम में फेरबदल, रेगुलर एक्सप्रेशन के माध्यम से गुण के लिए खोज एक स्ट्रिंग में अपने HTML निकालने और है। जब आप गुण पाते हैं, तो आप डोम में "सुई" जोड़ सकते हैं ताकि आप तत्वों का चयन करने के लिए jQuery का उपयोग कर सकें।

यहाँ एक काम कर अवधारणा (कंसोल खोलकर इसका चलाने) है:

http://jsfiddle.net/skylar/N43Bm/

कोड:

$.fn.extend({ 

    findAttributes: function(attribute) { 

     var attributeFinder = new RegExp(attribute + '(.+)="', "gi"); 
     var elementHTML = this.html().replace(attributeFinder, "data-needle='pin' "+attribute+"$1=\""); 

     this.html(elementHTML); 

     return this.find("[data-needle=pin]").removeAttr('data-needle'); 
    } 

}); 

console.log($("body").findAttributes('mce_'));

नोट: मेरी regexp महान नहीं है। इस उदाहरण में आपके पास बेहतर देखभाल करना होगा।

स्रोत

2012-04-25 20:19:14

कुछ एचटीएमएल विशेषताओं को कैसे प्राप्त करें जो कुछ (प्रारंभिक नाम, * नहीं * उनके मूल्य!)

उत्तर

संबंधित मुद्दे