क्या वास्तव में "HIERARCHY_REQUEST_ERR: DOM अपवाद 3" -Error पैदा कर सकता है?

184

वास्तव में यह jQuery से कैसे संबंधित है? मुझे पता है कि पुस्तकालय आंतरिक रूप से देशी जावास्क्रिप्ट फ़ंक्शंस का उपयोग करता है, लेकिन जब भी इस तरह की समस्या दिखाई देती है तो वह वास्तव में क्या करने की कोशिश कर रहा है?

javascript jquery domexception

— जूलियन वीमर
स्रोत

227

इसका मतलब है कि आपने DOM ट्री में एक डोम नोड को एक जगह डालने की कोशिश की है जहाँ वह नहीं जा सकता। सबसे आम जगह जो मैं देख रहा हूं वह सफारी पर है जो निम्नलिखित की अनुमति नहीं देता है:

document.appendChild(document.createElement('div'));

आम तौर पर, यह सिर्फ एक गलती है जहां यह वास्तव में इरादा था:

document.body.appendChild(document.createElement('div'));

जंगली में देखे गए अन्य कारण (टिप्पणियों से संक्षेप में):

आप अपने आप को एक नोड जोड़ने की कोशिश कर रहे हैं
आप शून्य से नोड को जोड़ने का प्रयास कर रहे हैं
आप एक नोड को एक टेक्स्ट नोड में संलग्न करने का प्रयास कर रहे हैं।
आपका HTML अमान्य है (जैसे अपना लक्ष्य नोड बंद करने में विफल)
ब्राउज़र सोचता है कि जिस HTML को आप जोड़ने का प्रयास कर रहे हैं वह XML है ( <!doctype html>अपने इंजेक्ट किए गए HTML में जोड़कर ठीक करें, या XHR के माध्यम से लाते समय सामग्री प्रकार निर्दिष्ट करें)

— केली नॉर्टन
स्रोत

49

त्रुटि तब भी होती है जब आप एक नोड को स्वयं प्रयास करते हैं और जोड़ते हैं। मैं बस इस एक में भाग गया :-)

— बेन क्लेटन

5

मुझे बस यह एक तत्व में एक अशक्त जोड़ने की कोशिश कर रहा है (और पूरी तरह से असंबंधित टिप - हमेशा सुनिश्चित करें कि आपके कार्य आपके द्वारा लिखी गई चीज़ को वापस करने के लिए वापस आएँ: P)

— Veli Gebrev

मैंने यह देखा जब समापन टैग में से एक लक्ष्य से गायब था।

— टॉम एच

AJAX के परिणामों को जोड़ने के लिए jQuery का उपयोग करते समय IE (9) इस त्रुटि को फेंक सकता है। response.xmlजहां उपलब्ध हो, उसका उपयोग करने से बचें । उदाहरण के लिए,$(e).append(response.xml || $(response));

— कोर्टनी क्रिस्टेंसेन

यह तब मिला जब मैंने एंड्रॉइड पर jQuery (डेस्कटॉप) से zepto में बदल दिया। वापस आ गया।

— रवींद्रनाथ अकिला

5

यदि आपको यह त्रुटि jquery ajax $ $ .ajax के कारण मिल रही है

फिर आपको यह निर्दिष्ट करने की आवश्यकता हो सकती है कि सर्वर से डेटाटाइप वापस आ रहा है। मैंने इस साधारण संपत्ति का उपयोग करके प्रतिक्रिया को बहुत अधिक निर्धारित किया है।

$.ajax({
    url: "URL_HERE",
    dataType: "html",
    success: function(response) {
        $('#ELEMENT').html(response);
    }
});

— डेव रॉबर्टसन
स्रोत

1

वेब / phonegap के लिए एक कोड बेस, गतिशील रूप में koorchik से जवाब का उपयोग कर टेम्पलेट लोड हो रहा है के लिए पुनर्संशोधित stackoverflow.com/questions/8366733/... । डेस्कटॉप ब्राउज़र में काम किया, मोबाइल ब्राउज़र या देशी ऐप में काम नहीं किया। इस समाधान ने चाल चली।

— किंजल दीक्षित

यहाँ एक ही मुद्दा, अजीब तरह से केवल आईओएस 5 में। डेटा टाइप निर्दिष्ट करना काम किया। धन्यवाद

— homerjam

3

विशेष रूप से jQuery के साथ आप इस मुद्दे को चला सकते हैं यदि तत्वों को बनाते समय html टैग के चारों ओर कीट को भूल जाएं:

 $("#target").append($("div").text("Test"));

इस त्रुटि को उठाएंगे क्योंकि आपका मतलब क्या था

 $("#target").append($("<div>").text("Test"));

— Fatmuemoo
स्रोत

3

यह त्रुटि तब हो सकती है जब आप DOM में एक नोड सम्मिलित करने का प्रयास करते हैं जो अमान्य HTML है, जो कि एक गलत विशेषता के रूप में सूक्ष्म रूप में कुछ हो सकता है, उदाहरण के लिए:

// <input> can have a 'type' attribute
var $input = $('<input/>').attr('type', 'text');
$holder.append($input);  // OK

// <div> CANNOT have a 'type' attribute
var $div = $('<div></div>').attr('type', 'text');
$holder.append($div);   // Error: HIERARCHY_REQUEST_ERR: DOM Exception 3

— एंड्रयू मैकलेओड
स्रोत

2

@ केली नॉर्टन अपने जवाब में सही है कि The browser thinks the HTML you are attempting to append is XMLऔर सुझाव देता है specifying the content type when fetching via XHR।

हालांकि यह सच है कि आप कभी-कभी तीसरे पक्ष के पुस्तकालयों का उपयोग करते हैं जिन्हें आप संशोधित नहीं करने जा रहे हैं। यह मेरे मामले में JQuery UI है। फिर आपको Content-Typeजावास्क्रिप्ट पक्ष पर प्रतिक्रिया प्रकार को ओवरराइड करने के बजाय प्रतिक्रिया में अधिकार प्रदान करना चाहिए । अपने Content-Typeको सेट करें text/htmlऔर आप ठीक हैं।

मेरे मामले में, यह था के रूप में आसान का नाम बदलने के रूप में file.xhtmlकरने के लिए file.html- आवेदन सर्वर बॉक्स से बाहर MIME प्रकार मैपिंग करने के लिए कुछ विस्तार किया था। जब सामग्री गतिशील होती है, तो आप किसी भी तरह से सामग्री की प्रतिक्रिया सेट कर सकते हैं (उदाहरण res.setContentType("text/html")के लिए सर्वलेट एपीआई)।

— Nowaker
स्रोत

1

आप इन सवालों को देख सकते हैं

पुनरावर्ती रूप से नेस्टेड सूची उत्पन्न करने के लिए जावास्क्रिप्ट का उपयोग करते समय HIERARCHY_REQUEST_ERR प्राप्त करना

या

j.NET UI डायलॉग ASP.NET बटन पोस्टबैक के साथ

निष्कर्ष है

जब आप फ़ंक्शन परिशिष्ट का उपयोग करने का प्रयास करते हैं, तो आपको इस उदाहरण की तरह, नए चर का उपयोग करना चाहिए

jQuery(function() {
   var dlg = jQuery("#dialog").dialog({ 
                        draggable: true, 
                        resizable: true, 
                        show: 'Transfer', 
                        hide: 'Transfer', 
                        width: 320, 
                        autoOpen: false, 
                        minHeight: 10, 
                        minwidth: 10 
          });
  dlg.parent().appendTo(jQuery("form:first"));
});

ऊपर के उदाहरण में, फ़ंक्शन एपेंडो को चलाने के लिए var "dlg" का उपयोग करता है। फिर त्रुटि "HIERARCHY_REQUEST_ERR" फिर से नहीं निकलेगी।

— शुद्ध
स्रोत

1

Google Chrome एक्सटेंशन Sidewiki का उपयोग करते समय मुझे इस त्रुटि का सामना करना पड़ा। इसे अक्षम करने से मेरे लिए समस्या हल हो गई।

— जेसी फाउलर
स्रोत

1

मैं यहां एक और विशिष्ट उत्तर जोड़ने जा रहा हूं क्योंकि यह उत्तर के लिए 2 घंटे की खोज थी ...

मैं एक दस्तावेज़ में एक टैग इंजेक्ट करने की कोशिश कर रहा था। Html ऐसा था:

<map id='imageMap' name='imageMap'>
  <area shape='circle' coords='55,28,5' href='#' title='1687.01 - 0 percentile' />
</map>

यदि आप ध्यान दें, तो टैग पूर्ववर्ती उदाहरण ( <area/>) में बंद है । इसे क्रोम ब्राउज़र में स्वीकार नहीं किया गया था। w3schools को लगता है कि इसे बंद कर दिया जाना चाहिए, और मुझे इस टैग पर आधिकारिक युक्ति नहीं मिली, लेकिन यह सुनिश्चित है कि क्रोम में काम नहीं करता। फ़ायरफ़ॉक्स इसे <area/>या <area></area>या के साथ स्वीकार नहीं करेगा<area> । क्रोम होना चाहिए <area>। IE कुछ भी स्वीकार करता है।

वैसे भी, यह त्रुटि हो सकती है क्योंकि आपका HTML सही नहीं है।

— markthegrea
स्रोत

1

मुझे पता है कि यह धागा पुराना है, लेकिन मुझे इस समस्या का एक और कारण मिला है, जो दूसरों को मददगार लग सकता है। मुझे Google Analytics के साथ त्रुटि हो रही थी कि वह स्वयं को एक HTML टिप्पणी में जोड़ सके। अपमानजनक कोड:

document.documentElement.firstChild.appendChild(ga);

यह त्रुटि पैदा कर रहा था क्योंकि मेरा पहला तत्व एक HTML टिप्पणी थी (अर्थात् एक ड्रीमविवर टेम्पलेट कोड)।

<!-- #BeginTemplate "/Templates/default.dwt.php" -->

मैंने कुछ के लिए अपमानजनक कोड को संशोधित नहीं किया, जिसमें बुलेटप्रूफ नहीं है, लेकिन बेहतर है:

document.documentElement.firstChild.nodeType===1 ? document.documentElement.firstChild.appendChild(ga) : document.documentElement.lastChild.appendChild(ga);

— S.Walker
स्रोत

1

यदि आप इंटरनेट एक्सप्लोरर में एक नोड को दूसरी विंडो में जोड़ने की कोशिश करते समय इस समस्या में भाग लेते हैं, तो नोड के बजाय नोड के अंदर HTML का उपयोग करने का प्रयास करें।

myElement.appendChild(myNode.html());

IE एक और विंडो में नोडिंग को जोड़ने का समर्थन नहीं करता है।

— दान-नोलन
स्रोत

क्या आपने वास्तव में यह कोशिश की थी? यहां तक कि क्रोम में भी मुझे टाइपऑर्डर मिल रहा है: 'नोड' पर 'परिशिष्ट' निष्पादित करने में विफल: पैरामीटर 1 प्रकार 'नोड' का नहीं है। (...)। Thats क्योंकि .html () टाइप स्ट्रिंग का है और appendChild Node टाइप करने की उम्मीद कर रहा है।

— joedotnot

1

यह ERROR मेरे साथ IE9 में हुआ था, जब मैंने appendChild को गतिशील रूप से जोड़ने का प्रयास किया था जो पहले से ही एक विंडो में मौजूद था। A विंडो एक चाइल्ड विंडो बनायेगी B. विंडो में B कुछ यूजर एक्शन के बाद एक फंक्शन चलेगा और उस पर एक अपेंडिहिल करेगा। एलिमेंट का उपयोग विंडो ए में करें window.opener.document.getElementById('formElement').appendChild(input);

यह एक त्रुटि फेंक देगा। document.createElement('input');चाइल्ड विंडो का उपयोग करके इनपुट एलिमेंट बनाने के साथ ही , इसे पैरामीटर के रूप में पास करनाwindow.opener विंडो ए के , और वहां एपेंड किया जाता है। केवल अगर मैंने उसी विंडो में इनपुट एलिमेंट बनाया है, जहाँ मैं इसे जोड़ने जा रहा था, तो यह बिना त्रुटियों के सफल होगा।

इस प्रकार मेरा निष्कर्ष (कृपया सत्यापित करें): document.createElementएक खिड़की में कोई तत्व गतिशील रूप से (उपयोग करके ) नहीं बनाया जा सकता है , और फिर .appendChildकिसी अन्य विंडो में एक तत्व के लिए संलग्न (उपयोग ) किया जा सकता है (शायद एक विशेष अतिरिक्त कदम उठाए बिना मैं यह सुनिश्चित करने में चूक गया कि इसे XML नहीं माना जाता है या कुछ और)। यह IE9 में विफल रहता है और त्रुटि को फेंकता है, FF में यह ठीक काम करता है।

पुनश्च। मैं jQuery का उपयोग नहीं करते।

— यति
स्रोत

आपके पॉइंटर की बदौलत, मुझे यह पता चला। यदि आप रुचि रखते हैं तो कृपया मेरे द्वारा पोस्ट किया गया उत्तर देखें।

— टी.एच.ओ

0

एक और कारण यह सामने आ सकता है कि आप तत्व तैयार होने से पहले संलग्न कर रहे हैं उदा

<body>

<script>
document.body.appendChild(foo);
</script>

</body>
</html>

इस स्थिति में, आपको स्क्रिप्ट को स्थानांतरित करने की आवश्यकता होगी। पूरी तरह से यकीन नहीं है कि अगर कोषेर है, लेकिन शरीर को मदद नहीं लगती है तो स्क्रिप्ट को आगे बढ़ाना: /

स्क्रिप्ट को स्थानांतरित करने के बजाय, आप एक इवेंट हैंडलर में भी एप्लाइड कर सकते हैं।

— allyourcode
स्रोत

0

मुझे वह त्रुटि मिली क्योंकि मैं अपने तत्व का क्लोन बनाना भूल गया था।

// creates an error
clone = $("#thing");
clone.appendTo("#somediv");

// does not
clone = $("#thing").clone();
clone.appendTo("#somediv");

— code_monk
स्रोत

0

सिर्फ संदर्भ के लिए।

IE खिड़की के संदर्भ से एक अलग विंडो संदर्भ में बनाए गए किसी भी तत्व को जोड़ना बंद कर देगा, जो तत्व को जोड़ रहा है।

जैसे

var childWindow = window.open('somepage.html');

//will throw the exception in IE
childWindow.document.body.appendChild(document.createElement('div'));

//will not throw exception in IE
childWindow.document.body.appendChild(childWindow.document.createElement('div'));

मुझे अभी तक पता नहीं चला है कि एक अलग विंडो संदर्भ का उपयोग करके jQuery के साथ एक डोम तत्व कैसे बनाया जाए।

— T.Ho
स्रोत

0

यदि IE स्क्रिप्ट स्क्रिप्ट डीबगिंग (Internet Explorer) अक्षम किया गया था तो मुझे यह त्रुटि मिलती है। यदि मैं स्क्रिप्ट डीबगिंग को सक्षम करता हूं तो मुझे त्रुटि दिखाई नहीं देती है और पृष्ठ ठीक काम करता है। यह अजीब लगता है कि डोम अपवाद को सक्षम या अक्षम डिबगिंग के साथ क्या करना है।

— अन्नपूर्णी डी
स्रोत