रेगेक्स

Question

के साथ div कक्षाओं के लिए खोजें सरल लगता है, हुह। बहुत सारे उत्तरों मैंने पाया लेकिन सभी jQuery या ProtoType का उपयोग करें। मुझे सादा जावास्क्रिप्ट चाहिए। यह मुश्किल नहीं होना चाहिए, लेकिन जावास्क्रिप्ट मेरी बात नहीं है; कोई केंद्रीय दस्तावेज का अर्थ है उम्र के लिए खोज करना और जो भी मैं चाहता हूं उसे नहीं ढूंढ रहा।

<div class="central_0"> .. </div> 
<div class="central_1"> .. </div> 
<div class="central_2"> .. </div> 

अब मैं उन DIVs के साथ काम करने के लिए जावास्क्रिप्ट का उपयोग करना चाहते:

निम्नलिखित HTML कोड स्निपेट पर विचार करें।

function processDivElements() 
{ 
// search for relevant DIV classes 
var divArray = document.getElementsByClass.regex('/^central_.*$/'); 

// do stuff with the DIV elements found 
foreach (divArray as divElement) 
{ 
    divElement.style.background = '#f00'; 
}; 
} 

किसी को भी मुझे उचित सादा जावास्क्रिप्ट को यह अनुवाद करने में मदद कर सकते हैं? मैं वर्गों का उपयोग करता हूं, आईडी नहीं। मैं नियमित अभिव्यक्ति का उपयोग करना पसंद करता हूं।

var $divs = $('div[class^="central_"]'); 

आप केवल नए ब्राउज़रों का समर्थन करना चाहते हैं, तो आप document.querySelectorAll() का उपयोग अनिवार्य रूप से एक ही बात करने के लिए कर सकते हैं::

var divs = document.querySelectorAll('div[class^="central_"]'); 

आप समर्थन करना चाहते हैं

Answer 1

jQuery समाधान वास्तव में अच्छा है पुराने ब्राउज़र, कोड भयानक हो जाता है:

var all_divs = document.getElementsByTagName('div'); 
var divs = []; 

for (var i = 0; i < all_divs.length; i++) { 
    var div = all_divs[i]; 

    if (div.className.match(/^central_\d+$/) { 
     divs.push(div); 
    } 
} 

इसके अलावा:

मैं कक्षाओं का उपयोग करता हूं, आईडी नहीं। मैं नियमित अभिव्यक्ति का उपयोग करना पसंद करता हूं।

आपकी कक्षाएं अनूठी हैं और वास्तव में आईडी की तरह काम कर रही हैं, जो वास्तव में कक्षाओं का इच्छित उपयोग नहीं है। इस के बजाय की तरह अपने HTML संरचना:

<div id="central_0" class="central">...</div> 
<div id="central_1" class="central">...</div> 
<div id="central_2" class="central">...</div> 

अब, जावास्क्रिप्ट हो जाता है सरल:

var $divs = $('.central');        // jQuery 
var divs = document.querySelectorAll('.central');  // Newer browsers 
var divs = document.getElementsByClassName('central'); // Older browsers 

Answer 2

सीधे regex के अनुरूप तत्वों प्राप्त करने के लिए कोई तरीका नहीं है, केवल एक ही चीज़ तुम कर सकते हो पाने के लिए है कुछ तत्वों (जैसे: टैगनाम, नाम, आदि ..) और फिर तत्वों को regex द्वारा फ़िल्टर करें।

अपने एचटीएमएल नमूने के साथ, आप केवल टैगनाम द्वारा सभी तत्व प्राप्त कर सकते हैं, और regex द्वारा className को जांचने के लिए रेगेक्स का उपयोग कर सकते हैं।

Answer 3

जैसा कि अन्य ने उल्लेख किया है कि आप getElementsByClassName विधि कॉल पर सीधे रेगेक्स का चयन नहीं कर सकते हैं।

लेकिन मैं इन अन्य मुद्दों को आपके कोड के साथ इंगित करूंगा, क्योंकि आप जावास्क्रिप्ट के लिए नए हैं।

कक्षाओं का उपयोग करना ठीक है, लेकिन आप अपने एचटीएमएल को लिखकर अपने लिए और अधिक काम कर रहे हैं।

इसके बजाय central_0....central_2 की अगर वे सब मूलतः एक ही सीएसएस नियमों पर काम कर रहे हैं, तो आप उन्हें, लिखना चाहिए इस central zero....central two फिर अपने central वर्ग समान नियम हो सकते हैं जैसे जब तुम # वर्गों के लिए कोई अंतर असाइन कर सकते हैं। इस तरह आप DRY principle का भी पालन करते हैं।

इसके अलावा आपको वास्तव में भाषा के सर्वोत्तम अभ्यासों पर चिपके रहने पर विचार करना चाहिए। यदि आप उन वर्गों के साथ अपने तत्वों को सीएसएस नियम नहीं दे रहे हैं तो आपको id's का उपयोग करना चाहिए, साथ ही यह आपके जीवन को अधिक आसान बनाता है।