जावास्क्रिप्ट: document.createNode या सादे HTML?

Question

बेहतर

var foo = '<div> bar </div>'; 

तरह

document.createNode(); 

या सादा पाठ का उपयोग करने के लिए जावास्क्रिप्ट के साथ HTML मार्कअप बनाने के लिए है?

Answer 1

इस विशेष मामले में कोई "बेहतर" नहीं है, यह सबसे आसानी से बनाए रखा जा सकता है। और प्रोग्रामर वरीयता।

कुछ ब्राउज़रों में, डीओएम का उपयोग तत्वों और नोड्स बनाने के लिए, प्रदर्शन के संदर्भ में, दूसरों की तुलना में तेज़ है। कुछ उपयोगकर्ता एजेंट तारों को तेजी से संसाधित करते हैं, उदाहरण के लिए innerHTML संपत्ति सेट करके।

मैं व्यक्तिगत रूप से हमेशा डोम ऑब्जेक्ट्स का उपयोग करना पसंद करता हूं, लेकिन मैं mootools ढांचे का उपयोग करता हूं जो स्वयं को इस दृष्टिकोण में उधार देता है। jQuery स्ट्रिंग-आधारित निर्माण को प्रोत्साहित करता है। इस बेंचमार्क

चेक आउट: http://jsperf.com/string-vs-createelement/3, लेकिन यह भी इन लेखों पर विचार करें: http://www.quirksmode.org/dom/innerhtml_old.html और http://karma.nucleuscms.org/item/101

Answer 2

डीओएम नोड फ़ंक्शंस का उपयोग करना बेहतर है। यदि आप इसे स्ट्रिंग का उपयोग करके बनाना चाहते हैं, तो jQuery में देखें, क्योंकि इसमें आपके लिए DOM नोड्स में सही तरीके से पार्स करने के तरीके हैं।

var foo = $('<div> bar </div>'); 

Answer 3

डोम हेरफेर कार्यों का उपयोग करना आपके द्वारा बनाए तत्वों के लिए एक संदर्भ, एक के बाद एक हो सकता है, और कोड को संशोधित करना आसान हो जाएगा बाद में, उदाहरण के लिए पेड़ के आदेश को संशोधित करें, तत्व जोड़ना या निकालना, और डीबगिंग उद्देश्यों के लिए भी।

यह कहा गया है कि कुछ बार मैंने अनुभव किया है जिसमें डोम हेरफेर फ़ंक्शन सबसे अच्छा तरीका नहीं है।

उदाहरण के लिए मुझे मूल रूप से टेक्स्ट सीएसएस नियमों के माध्यम से तत्वों की शैली को नियंत्रित करने के लिए शैली टैग की सामग्री को वास्तविक समय में संशोधित करने की आवश्यकता थी, जो कि आप विभिन्न जेएस स्टाइल ऑब्जेक्ट्स का उपयोग करके सभी ब्राउज़रों में हासिल नहीं कर सकते हैं, क्योंकि उनमें केवल पढ़ने योग्य गुण होते हैं।

इस मामले में स्टाइल टैग एचटीएमएल केवल आईई के लिए पढ़ा गया था (या कम से कम आईई इसे आंतरिक एचटीएमएल या इसी तरह के माध्यम से संशोधित नहीं करना चाहता था), मुझे मिला एकमात्र समाधान पुराने एचटीएमएल मान को पढ़ना था, इसे बदलना तत्व बनाते समय, तत्व को हटाएं और स्ट्रिंग में सीधे टाइप किए गए नए एचटीएमएल के साथ एक नया स्टाइल टैग तत्व बनाएं।

यह कहा गया, जब भी संभव हो मैं डीओएम नोड कार्यों के साथ जाऊंगा।