क्या कोई getElementsByTagName() जावास्क्रिप्ट स्ट्रिंग चर के लिए फ़ंक्शन की तरह है?

Question

मैं वेब पेज में किसी तत्व से तत्वों का संग्रह प्राप्त करने के लिए getElementsByTagName() फ़ंक्शन का उपयोग कर सकता हूं।

मैं एक DOM तत्व की सामग्री के बजाय जावास्क्रिप्ट स्ट्रिंग चर की सामग्री पर एक समान फ़ंक्शन का उपयोग करने में सक्षम होना चाहता हूं।

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

संपादित

मैं मक्खी पर एक तत्व बनाकर ऐसा कर सकते हैं।

var myElement = new Element('div'); 
myElement.innerHTML = "<strong>hello</strong><em>there</em><strong>hot stuff</strong>"; 
var emCollection = myElement.getElementsByTagName('em'); 
alert(emCollection.length); // This gives 1 

लेकिन getElementsByTagName() फ़ंक्शन के उपयोग की सुविधा के लिए मक्खी पर एक तत्व बनाने सिर्फ सही नहीं लगता है और इंटरनेट एक्सप्लोरर में तत्वों के साथ काम नहीं करता।

Answer 1

स्ट्रिंग में HTML कुछ भी खास नहीं है। यह सिर्फ एक स्ट्रिंग में पाठ है। उपयोगी होने के लिए इसे एक पेड़ में पार्स किया जाना चाहिए। यही कारण है कि आपको एक तत्व बनाने की आवश्यकता है, फिर उस पर getElementsByTagName पर कॉल करें, जैसा कि आप अपने उदाहरण में दिखाते हैं।

Answer 2

function countTags(html, tagName) { 
    var matches = html.match(new RegExp("<" + tagName + "[\\s>]", "ig")); 
    return matches ? matches.length : 0; 
} 

alert(
    countTags(
     "<strong>hello</strong><em>there</em><strong>hot stuff</strong>", 
     "em" 
    ) 
); // 1 

Answer 3

जैसा कि आपने दिखाया है, डीओएम में स्ट्रिंग इंजेक्शन करना, ऐसा करने का सबसे आसान, सबसे विश्वसनीय तरीका है। यदि आप एक स्ट्रिंग पर काम करते हैं, तो आपको सभी संभव बचने वाले परिदृश्यों को ध्यान में रखना होगा जो को एक टैग की तरह दिखता है जो वास्तव में टैग नहीं है।

उदाहरण के लिए, यदि आप अपने मार्कअप में

<button value="<em>"/> 
<button value="</em>"/> 

हो सकता था - अगर आप एक स्ट्रिंग के रूप में यह करते हैं, आपको लगता है कि तुम वहाँ में एक <em> टैग है, लेकिन वास्तविकता में, आप केवल दो बटन टैग नहीं है ।

innerHTML के माध्यम से डोम में इंजेक्शन करके आप ब्राउज़र के अंतर्निर्मित HTML पार्सर का लाभ उठा रहे हैं, जो कि बहुत तेज है। नियमित अभिव्यक्ति के माध्यम से ऐसा करना एक दर्द होगा, और ब्राउज़र आम तौर पर तारों के भीतर तत्वों को खोजने के लिए कार्यक्षमता की तरह डोम प्रदान नहीं करते हैं।

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

Answer 4

var domParser = new DOMParser(); 
var htmlString = "<strong>hello</strong><em>there</em><strong>hot stuff</strong>"; 
var docElement = domParser.parseFromString(htmlString, "text/html").documentElement; 
var emCollection = docElement.getElementsByTagName("em"); 
for (var i = 0; i < emCollection.length; i++) { 
    console.log(emCollection[i]); 
}