Jak dokładnie odnosi się do jQuery? Wiem, że biblioteka używa wewnętrznych funkcji javascript wewnętrznie, ale co dokładnie próbuje zrobić, gdy pojawia się taki problem?
Jak dokładnie odnosi się do jQuery? Wiem, że biblioteka używa wewnętrznych funkcji javascript wewnętrznie, ale co dokładnie próbuje zrobić, gdy pojawia się taki problem?
Odpowiedzi:
Oznacza to, że próbowałeś wstawić węzeł DOM w miejsce w drzewie DOM, do którego nie może się udać. Najczęstsze miejsce, które widzę, to Safari, które nie pozwala na:
document.appendChild(document.createElement('div'));
Zasadniczo jest to tylko błąd, w którym to rzeczywiście było zamierzone:
document.body.appendChild(document.createElement('div'));
Inne przyczyny obserwowane na wolności (podsumowane z komentarzy):
<!doctype html>
do wstrzykniętego HTML lub określając typ zawartości podczas pobierania przez XHR)response.xml
jeśli jest to możliwe. Na przykład$(e).append(response.xml || $(response));
Jeśli otrzymujesz ten błąd z powodu jquery ajax, zadzwoń do $ .ajax
Następnie może być konieczne określenie, jaki typ danych wraca z serwera. Naprawiłem odpowiedź bardzo często za pomocą tej prostej właściwości.
$.ajax({
url: "URL_HERE",
dataType: "html",
success: function(response) {
$('#ELEMENT').html(response);
}
});
Ten błąd może wystąpić, gdy próbujesz wstawić węzeł do DOM, który jest nieprawidłowym kodem HTML, co może być czymś tak subtelnym jak niepoprawny atrybut, na przykład:
// <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 ma rację w odpowiedzi na to pytanie The browser thinks the HTML you are attempting to append is XML
i sugeruje specifying the content type when fetching via XHR
.
To prawda, ale czasami korzystasz z bibliotek stron trzecich, których nie zamierzasz modyfikować. W moim przypadku jest to interfejs użytkownika JQuery. Następnie powinieneś podać prawo Content-Type
w odpowiedzi zamiast nadpisywania typu odpowiedzi po stronie JavaScript. Ustaw Content-Type
na text/html
i jesteś w porządku.
W moim przypadku było tak łatwe, jak zmiana nazwy file.xhtml
na file.html
- serwer aplikacji miał pewne rozszerzenie MIME typów odwzorowań po wyjęciu z pudełka. Gdy treść jest dynamiczna, możesz w jakiś sposób ustawić typ odpowiedzi (np. res.setContentType("text/html")
W Servlet API).
Możesz zobaczyć te pytania
lub
Okno dialogowe interfejsu użytkownika jQuery z zwrotnym przyciskiem ASP.NET
Z tego wniosek
kiedy próbujesz użyć funkcji append, powinieneś użyć nowej zmiennej, jak w tym przykładzie
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"));
});
W powyższym przykładzie użyto var "dlg", aby uruchomić funkcję appendTo. Wtedy błąd „HIERARCHY_REQUEST_ERR” nie pojawi się ponownie.
Wystąpił ten błąd podczas korzystania z rozszerzenia Sidewiki Google Chrome. Wyłączenie go rozwiązało problem.
Dodam tutaj jeszcze jedną konkretną odpowiedź, ponieważ było to 2-godzinne wyszukiwanie odpowiedzi ...
Próbowałem wstrzyknąć znacznik do dokumentu. HTML był taki:
<map id='imageMap' name='imageMap'>
<area shape='circle' coords='55,28,5' href='#' title='1687.01 - 0 percentile' />
</map>
Jeśli zauważysz, znacznik jest zamknięty w poprzednim przykładzie ( <area/>
). Nie zostało to zaakceptowane w przeglądarkach Chrome. Wygląda na to, że w3schools powinien być zamknięty i nie mogłem znaleźć oficjalnej specyfikacji tego tagu, ale na pewno nie działa w Chrome. Firefox nie zaakceptuje go za pomocą <area/>
lub <area></area>
lub <area>
. Chrome musi mieć <area>
. IE akceptuje wszystko.
W każdym razie ten błąd może być spowodowany niepoprawnym kodem HTML.
Wiem, że ten wątek jest stary, ale napotkałem inną przyczynę problemu, która może być dla innych pomocna. Wystąpił błąd związany z tym, że Google Analytics próbował dołączyć się do komentarza HTML. Obraźliwy kod:
document.documentElement.firstChild.appendChild(ga);
Powodowało to błąd, ponieważ moim pierwszym elementem był komentarz HTML (mianowicie kod szablonu Dreamweaver).
<!-- #BeginTemplate "/Templates/default.dwt.php" -->
Zmodyfikowałem kod obrażający na coś, co nie jest kuloodporne, ale lepiej:
document.documentElement.firstChild.nodeType===1 ? document.documentElement.firstChild.appendChild(ga) : document.documentElement.lastChild.appendChild(ga);
Jeśli napotkasz ten problem podczas próby dołączenia węzła do innego okna w programie Internet Explorer, spróbuj użyć kodu HTML wewnątrz węzła zamiast samego węzła.
myElement.appendChild(myNode.html());
IE nie obsługuje dołączania węzłów do innego okna.
Ten BŁĄD zdarzył mi się w IE9, gdy próbowałem dynamicznie dołączyćDziecko do tego, które już istniało w oknie A. Okno A utworzy okno potomne B. W oknie B po akcji użytkownika uruchomiona zostanie funkcja i uruchomi appendChild na element formularza w oknie A za pomocą window.opener.document.getElementById('formElement').appendChild(input);
To spowodowałoby błąd. To samo z tworzeniem elementu wejściowego za pomocą document.createElement('input');
w oknie potomnym, przekazywanie go jako parametru do window.opener
okna A i tam dołączanie. Tylko jeśli utworzyłem element wejściowy w tym samym oknie, w którym zamierzałem go dodać, odniósłby sukces bez błędów.
Tak więc mój wniosek (proszę zweryfikować): żaden element nie może być dynamicznie tworzony (za pomocą document.createElement
) w jednym oknie, a następnie dołączany (za pomocą .appendChild
) do elementu w innym oknie (bez zrobienia określonego dodatkowego kroku, który przegapiłem, aby upewnić się, że nie jest uważany za XML lub coś). To się nie udaje w IE9 i generuje błąd, ale w FF działa to dobrze.
PS. Nie używam jQuery.
Innym powodem może być to, że dołączasz, zanim element będzie gotowy, np
<body>
<script>
document.body.appendChild(foo);
</script>
</body>
</html>
W takim przypadku musisz przenieść skrypt po. Nie jestem do końca pewien, czy to koszerne, ale przesuwanie skryptu po ciele nie wydaje się pomocne: /
Zamiast przenosić skrypt, możesz także dołączyć go w module obsługi zdarzeń.
Tylko w celach informacyjnych.
IE zablokuje dołączanie dowolnego elementu utworzonego w innym kontekście okna niż kontekst okna, do którego element się dołącza.
na przykład
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'));
Nie wymyśliłem jeszcze, jak utworzyć element dom za pomocą jQuery przy użyciu innego kontekstu okna.
Ten błąd pojawia się w IE9, jeśli wyłączyłem opcję debugowania skryptu (Internet Explorer). Jeśli włączę debugowanie skryptu, nie widzę błędu, a strona działa poprawnie. Wydaje się to dziwne, co wyjątek DOM ma do czynienia z debugowaniem włączonym lub wyłączonym.