มันเกี่ยวข้องกับ jQuery อย่างไร? ฉันรู้ว่าห้องสมุดใช้ฟังก์ชันจาวาสคริปต์ดั้งเดิมภายใน แต่สิ่งที่พยายามทำทุกครั้งที่เกิดปัญหาดังกล่าว
มันเกี่ยวข้องกับ jQuery อย่างไร? ฉันรู้ว่าห้องสมุดใช้ฟังก์ชันจาวาสคริปต์ดั้งเดิมภายใน แต่สิ่งที่พยายามทำทุกครั้งที่เกิดปัญหาดังกล่าว
คำตอบ:
หมายความว่าคุณพยายามแทรกโหนด DOM ในสถานที่ในต้นไม้ DOM ซึ่งไม่สามารถไปได้ สถานที่ที่พบบ่อยที่สุดที่ฉันเห็นคือใน Safari ซึ่งไม่อนุญาตสิ่งต่อไปนี้
document.appendChild(document.createElement('div'));โดยทั่วไปนี่เป็นเพียงความผิดพลาดที่นี่ตั้งใจจริง:
document.body.appendChild(document.createElement('div'));สาเหตุอื่น ๆ ที่เห็นในป่า (สรุปจากความคิดเห็น):
<!doctype html>HTML ที่ถูกแทรกของคุณหรือระบุประเภทเนื้อหาเมื่อดึงข้อมูลผ่าน XHR)response.xmlที่มีอยู่ ตัวอย่างเช่น$(e).append(response.xml || $(response));
หากคุณได้รับข้อผิดพลาดนี้เนื่องจาก jquery ajax โทร $ .ajax
จากนั้นคุณอาจต้องระบุว่าdataTypeกำลังกลับมาจากเซิร์ฟเวอร์ใด ฉันได้แก้ไขคำตอบมากมายโดยใช้คุณสมบัติที่เรียบง่ายนี้
$.ajax({
url: "URL_HERE",
dataType: "html",
success: function(response) {
$('#ELEMENT').html(response);
}
});โดยเฉพาะกับ jQuery คุณสามารถพบปัญหานี้ได้หากลืม carets รอบ ๆ แท็ก html เมื่อสร้างองค์ประกอบ:
$("#target").append($("div").text("Test"));จะเพิ่มข้อผิดพลาดนี้เพราะสิ่งที่คุณหมายถึงคือ
$("#target").append($("<div>").text("Test"));ข้อผิดพลาดนี้อาจเกิดขึ้นเมื่อคุณพยายามที่จะแทรกโหนดใน 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@ Kelly Norton พูดถูกThe browser thinks the HTML you are attempting to append is XMLและตอบspecifying the content type when fetching via XHRถูก
มันเป็นความจริง แต่บางครั้งคุณก็ใช้ห้องสมุดบุคคลที่สามซึ่งคุณไม่ต้องการแก้ไข เป็น JQuery UI ในกรณีของฉัน จากนั้นคุณควรให้สิทธิContent-Typeในการตอบสนองแทนการเอาชนะประเภทการตอบสนองทางด้าน JavaScript การตั้งค่าของคุณContent-Typeไปtext/htmlและคุณจะมีการปรับ
ในกรณีของฉันมันก็เป็นเรื่องง่ายเหมือนการเปลี่ยนชื่อfile.xhtmlไปfile.html- โปรแกรมเซิร์ฟเวอร์มีบางส่วนขยายเป็น MIME แมปประเภทออกจากกล่อง เมื่อเนื้อหาเป็นแบบไดนามิกคุณสามารถตั้งค่าประเภทของการตอบสนองอย่างใดอย่างหนึ่ง (เช่นres.setContentType("text/html")ใน Servlet API)
คุณสามารถดูคำถามเหล่านี้
รับ HIERARCHY_REQUEST_ERR เมื่อใช้ Javascript เพื่อสร้างรายการซ้อน
หรือ
ไดอะล็อก jQuery UI พร้อม postback ปุ่ม 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" เพื่อเรียกใช้ฟังก์ชัน appendTo ดังนั้นข้อผิดพลาด“ HIERARCHY_REQUEST_ERR "จะไม่ออกมาอีก
ฉันพบข้อผิดพลาดนี้เมื่อใช้ส่วนขยาย Sidewiki ของ Google Chrome การปิดใช้งานจะช่วยแก้ไขปัญหาให้ฉันได้
ฉันจะเพิ่มคำตอบเฉพาะเจาะจงอีกหนึ่งข้อที่นี่เพราะมันเป็นการค้นหาคำตอบ 2 ชั่วโมง ...
ฉันพยายามฉีดแท็กลงในเอกสาร html เป็นเช่นนี้:
<map id='imageMap' name='imageMap'>
<area shape='circle' coords='55,28,5' href='#' title='1687.01 - 0 percentile' />
</map>หากคุณสังเกตเห็นแท็กจะปิดในตัวอย่างก่อนหน้า ( <area/>) สิ่งนี้ไม่ได้รับการยอมรับในเบราว์เซอร์ Chrome ดูเหมือนว่าโรงเรียนw3จะคิดว่ามันควรจะปิดและฉันไม่สามารถหาข้อมูลจำเพาะอย่างเป็นทางการในแท็กนี้ แต่แน่ใจว่าใช้งานไม่ได้ใน Chrome Firefox จะไม่ยอมรับมันด้วย<area/>หรือหรือ<area></area> โครเมี่ยมจะต้องมี<area> <area>IE ยอมรับทุกอย่าง
อย่างไรก็ตามข้อผิดพลาดนี้อาจเป็นเพราะ HTML ของคุณไม่ถูกต้อง
ฉันรู้ว่ากระทู้นี้เก่า แต่ฉันพบสาเหตุของปัญหาที่คนอื่นอาจพบว่ามีประโยชน์ ฉันได้รับข้อผิดพลาดกับ Google Analytics ที่พยายามจะผนวกเข้ากับความคิดเห็น HTML รหัสที่ละเมิด:
document.documentElement.firstChild.appendChild(ga);สิ่งนี้ทำให้เกิดข้อผิดพลาดเนื่องจากองค์ประกอบแรกของฉันคือความคิดเห็น HTML (เช่นรหัสแม่แบบ Dreamweaver)
<!-- #BeginTemplate "/Templates/default.dwt.php" -->ฉันแก้ไขโค้ดที่ละเมิดเป็นสิ่งที่ยอมรับไม่ได้เป็นกระสุน
document.documentElement.firstChild.nodeType===1 ? document.documentElement.firstChild.appendChild(ga) : document.documentElement.lastChild.appendChild(ga);หากคุณพบปัญหานี้ขณะที่พยายามผนวกโหนดเข้ากับหน้าต่างอื่นใน Internet Explorer ให้ลองใช้ HTML ภายในโหนดแทนโหนดเอง
myElement.appendChild(myNode.html());IE ไม่สนับสนุนการผนวกโหนดไปยังหน้าต่างอื่น
ข้อผิดพลาดนี้เกิดขึ้นกับฉันใน IE9 เมื่อฉันพยายามที่จะผนวกเด็กที่มีอยู่แล้วในหน้าต่าง A. หน้าต่าง A จะสร้างหน้าต่างลูก B ในหน้าต่าง B หลังจากผู้ใช้บางคนฟังก์ชั่นจะทำงานและทำ appendChild บน องค์ประกอบแบบฟอร์มในหน้าต่าง A โดยใช้ window.opener.document.getElementById('formElement').appendChild(input);
นี่จะทำให้เกิดข้อผิดพลาด เช่นเดียวกับการสร้างองค์ประกอบอินพุตโดยใช้document.createElement('input');ในหน้าต่างลูกผ่านมันเป็นพารามิเตอร์ไปที่window.openerหน้าต่าง A และมีผนวก เฉพาะในกรณีที่ฉันสร้างองค์ประกอบอินพุตในหน้าต่างเดียวกับที่ฉันจะผนวกมันก็จะประสบความสำเร็จโดยไม่มีข้อผิดพลาด
ดังนั้นข้อสรุปของฉัน (โปรดยืนยัน): ไม่มีองค์ประกอบใดที่สามารถสร้างแบบไดนามิก (ใช้document.createElement) ในหน้าต่างเดียวและต่อท้าย (ใช้.appendChild) กับองค์ประกอบในหน้าต่างอื่น (โดยไม่ต้องใช้ขั้นตอนพิเศษที่ฉันพลาดเพื่อให้แน่ใจว่าไม่ได้พิจารณาว่าเป็น XML หรือบางสิ่งบางอย่าง). สิ่งนี้ล้มเหลวใน IE9 และส่งข้อผิดพลาดใน FF นี้ทำงานได้ดีแม้ว่า
PS ฉันไม่ได้ใช้ jQuery
อีกเหตุผลหนึ่งที่ทำให้เกิดขึ้นได้คือคุณผนวกท้ายองค์ประกอบพร้อมเช่น
<body>
<script>
document.body.appendChild(foo);
</script>
</body>
</html>ในกรณีนี้คุณจะต้องย้ายสคริปต์หลังจาก ไม่แน่ใจว่าเป็นเพียว ๆ หรือไม่ แต่การย้ายสคริปต์หลังจากที่ร่างกายไม่ช่วย: /
แทนที่จะย้ายสคริปต์คุณสามารถผนวกท้ายในตัวจัดการเหตุการณ์
ฉันได้รับข้อผิดพลาดนั้นเพราะฉันลืมโคลนองค์ประกอบของฉัน
// creates an error
clone = $("#thing");
clone.appendTo("#somediv");
// does not
clone = $("#thing").clone();
clone.appendTo("#somediv");เพียงเพื่อการอ้างอิง
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'));ฉันยังไม่เข้าใจวิธีการสร้างองค์ประกอบ dom กับ jQuery โดยใช้บริบทหน้าต่างที่แตกต่างกัน
ฉันได้รับข้อผิดพลาดนี้ใน IE9 หากฉันปิดใช้งานตัวเลือกการดีบักสคริปต์ (Internet Explorer) หากฉันเปิดใช้งานการดีบักสคริปต์ฉันไม่เห็นข้อผิดพลาดและหน้าเว็บทำงานได้ดี ดูเหมือนว่าแปลกที่ข้อยกเว้น DOM เกี่ยวข้องกับการดีบักทั้งที่เปิดใช้งานหรือปิดใช้งาน