Bagaimana tepatnya hubungannya dengan jQuery? Saya tahu pustaka menggunakan fungsi javascript asli secara internal, tetapi apa sebenarnya yang coba dilakukan setiap kali masalah seperti itu muncul?
Bagaimana tepatnya hubungannya dengan jQuery? Saya tahu pustaka menggunakan fungsi javascript asli secara internal, tetapi apa sebenarnya yang coba dilakukan setiap kali masalah seperti itu muncul?
Jawaban:
Itu berarti Anda telah mencoba untuk memasukkan simpul DOM ke suatu tempat di pohon DOM di mana ia tidak bisa pergi. Tempat paling umum yang saya lihat adalah di Safari yang tidak mengizinkan yang berikut ini:
document.appendChild(document.createElement('div'));Secara umum, ini hanya kesalahan di mana ini sebenarnya dimaksudkan:
document.body.appendChild(document.createElement('div'));Penyebab lain yang terlihat di alam liar (dirangkum dari komentar):
<!doctype html>ke HTML yang Anda suntik, atau sebutkan jenis konten saat mengambil melalui XHR)response.xmltersedia. Misalnya,$(e).append(response.xml || $(response));
Jika Anda mendapatkan kesalahan ini karena panggilan ajax jquery $ .ajax
Maka Anda mungkin perlu menentukan apa yang dataType datang kembali dari server. Saya sudah banyak memperbaiki respons menggunakan properti sederhana ini.
$.ajax({
url: "URL_HERE",
dataType: "html",
success: function(response) {
$('#ELEMENT').html(response);
}
});Khususnya dengan jQuery, Anda dapat mengalami masalah ini jika lupa tanda sisipan di sekitar tag html saat membuat elemen:
$("#target").append($("div").text("Test"));Akan meningkatkan kesalahan ini karena apa yang Anda maksudkan adalah
$("#target").append($("<div>").text("Test"));Kesalahan ini dapat terjadi ketika Anda mencoba menyisipkan simpul ke DOM yang HTML tidak valid, yang dapat menjadi sesuatu yang halus seperti atribut yang salah, misalnya:
// <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 benar dalam jawabannya The browser thinks the HTML you are attempting to append is XMLdan menyarankan specifying the content type when fetching via XHR.
Memang benar namun Anda kadang-kadang menggunakan perpustakaan pihak ketiga yang tidak akan Anda modifikasi. Ini JQuery UI dalam kasus saya. Maka Anda harus memberikan hak Content-Typedalam respons alih-alih mengganti jenis respons di sisi JavaScript. Tetapkan Content-Typeuntuk text/htmldan Anda baik-baik saja.
Dalam kasus saya, itu semudah mengubah nama file.xhtmlke file.html- aplikasi server memiliki beberapa ekstensi untuk MIME jenis pemetaan keluar dari kotak. Saat konten dinamis, Anda dapat mengatur jenis respons konten, entah bagaimana (misalnya res.setContentType("text/html")di Servlet API).
Anda dapat melihat pertanyaan-pertanyaan ini
atau
Dialog UI jQuery dengan postback tombol ASP.NET
Kesimpulannya adalah
ketika Anda mencoba menggunakan fungsi append, Anda harus menggunakan variabel baru, seperti contoh ini
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"));
});Pada contoh di atas, gunakan var "dlg" untuk menjalankan fungsi appendTo. Kemudian kesalahan "HIERARCHY_REQUEST_ERR" tidak akan keluar lagi.
Saya mengalami kesalahan ini saat menggunakan ekstensi Google Chrome Sidewiki. Menonaktifkan itu memecahkan masalah bagi saya.
Saya akan menambahkan satu lagi jawaban spesifik di sini karena itu adalah pencarian 2 jam untuk jawabannya ...
Saya mencoba menyuntikkan tag ke dokumen. Html seperti ini:
<map id='imageMap' name='imageMap'>
<area shape='circle' coords='55,28,5' href='#' title='1687.01 - 0 percentile' />
</map>Jika Anda perhatikan, tag ditutup pada contoh sebelumnya ( <area/>). Ini tidak diterima di browser Chrome. w3schools tampaknya berpikir itu harus ditutup, dan saya tidak dapat menemukan spek resmi pada tag ini, tetapi jelas tidak bekerja di Chrome. Firefox tidak akan menerimanya dengan <area/>atau <area></area>atau <area>. Chrome harus punya <area>. IE menerima apapun.
Lagi pula, kesalahan ini bisa jadi karena HTML Anda tidak benar.
Saya tahu utas ini sudah lama, tetapi saya telah menemukan penyebab lain masalah yang mungkin bermanfaat bagi orang lain. Saya mendapatkan kesalahan dengan Google Analytics yang mencoba menambahkan komentar HTML. Kode yang menyinggung:
document.documentElement.firstChild.appendChild(ga);Ini menyebabkan kesalahan karena elemen pertama saya adalah komentar HTML (yaitu kode template Dreamweaver).
<!-- #BeginTemplate "/Templates/default.dwt.php" -->Saya memodifikasi kode yang menyinggung menjadi sesuatu yang memang tidak tahan peluru, tetapi lebih baik:
document.documentElement.firstChild.nodeType===1 ? document.documentElement.firstChild.appendChild(ga) : document.documentElement.lastChild.appendChild(ga);Jika Anda mengalami masalah ini saat mencoba menambahkan node ke jendela lain di Internet Explorer, coba gunakan HTML di dalam node alih-alih node itu sendiri.
myElement.appendChild(myNode.html());IE tidak mendukung menambahkan node ke jendela lain.
GALAT ini terjadi pada saya di IE9 ketika saya mencoba untuk menambahkan anak secara dinamis ke yang sudah ada di jendela A. Jendela A akan membuat jendela anak B. Di jendela B setelah beberapa tindakan pengguna, suatu fungsi akan berjalan dan melakukan lampiran pada elemen bentuk di jendela A menggunakan window.opener.document.getElementById('formElement').appendChild(input);
Ini akan menimbulkan kesalahan. Sama dengan membuat elemen input menggunakan document.createElement('input');di jendela anak, meneruskannya sebagai parameter ke window.openerjendela A, dan ada menambahkan. Hanya jika saya membuat elemen input di jendela yang sama di mana saya akan menambahkannya, itu akan berhasil tanpa kesalahan.
Jadi kesimpulan saya (harap verifikasi): tidak ada elemen yang dapat dibuat secara dinamis (menggunakan document.createElement) di satu jendela, dan kemudian ditambahkan (menggunakan .appendChild) ke elemen di jendela lain (tanpa mengambil langkah ekstra tertentu yang mungkin saya lewatkan untuk memastikan itu tidak dianggap XML) atau sesuatu). Ini gagal di IE9 dan melempar kesalahan, dalam FF ini berfungsi dengan baik.
PS. Saya tidak menggunakan jQuery.
Alasan lain ini dapat muncul adalah bahwa Anda menambahkan sebelum elemen siap misalnya
<body>
<script>
document.body.appendChild(foo);
</script>
</body>
</html>Dalam hal ini, Anda harus memindahkan skrip setelah. Tidak sepenuhnya yakin apakah itu halal, tetapi memindahkan skrip setelah tubuh sepertinya tidak membantu: /
Alih-alih memindahkan skrip, Anda juga dapat melakukan penambahan dalam pengendali acara.
Hanya untuk referensi.
IE akan memblokir menambahkan elemen apa pun yang dibuat dalam konteks jendela yang berbeda dari konteks jendela tempat elemen tersebut ditambahkan.
misalnya
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'));Saya belum menemukan cara membuat elemen dom dengan jQuery menggunakan konteks jendela yang berbeda.
Saya mendapatkan kesalahan ini di IE9 jika saya telah menonaktifkan opsi debugging skrip (Internet Explorer). Jika saya mengaktifkan debugging skrip saya tidak melihat kesalahan dan halaman berfungsi dengan baik. Tampaknya aneh apa yang harus dilakukan pengecualian DOM dengan debugging diaktifkan atau dinonaktifkan.