¿Cómo se relaciona exactamente con jQuery? Sé que la biblioteca usa funciones nativas de JavaScript internamente, pero ¿qué es exactamente lo que intenta hacer cada vez que aparece un problema?
¿Cómo se relaciona exactamente con jQuery? Sé que la biblioteca usa funciones nativas de JavaScript internamente, pero ¿qué es exactamente lo que intenta hacer cada vez que aparece un problema?
Respuestas:
Significa que ha intentado insertar un nodo DOM en un lugar del árbol DOM donde no puede ir. El lugar más común en el que veo esto es en Safari, que no permite lo siguiente:
document.appendChild(document.createElement('div'));En general, esto es solo un error donde realmente se pretendía:
document.body.appendChild(document.createElement('div'));Otras causas observadas en la naturaleza (resumidas de los comentarios):
<!doctype html>a su HTML inyectado o especificando el tipo de contenido al buscar a través de XHR)response.xmldonde esté disponible. Por ejemplo,$(e).append(response.xml || $(response));
Si recibe este error debido a un jquery ajax, llame a $ .ajax
Entonces es posible que tenga que especificar cuál es el tipo de datos va a volver desde el servidor. He arreglado mucho la respuesta usando esta propiedad simple.
$.ajax({
url: "URL_HERE",
dataType: "html",
success: function(response) {
$('#ELEMENT').html(response);
}
});Este error puede ocurrir cuando intenta insertar un nodo en el DOM que es HTML no válido, que puede ser algo tan sutil como un atributo incorrecto, por ejemplo:
// <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 tiene razón en su respuesta The browser thinks the HTML you are attempting to append is XMLy sugiere specifying the content type when fetching via XHR.
Sin embargo, es cierto que a veces utiliza bibliotecas de terceros que no va a modificar. Es JQuery UI en mi caso. Luego, debe proporcionar el derecho Content-Typeen la respuesta en lugar de anular el tipo de respuesta en el lado de JavaScript. Establecer su Content-Typea text/htmly que están bien.
En mi caso, era tan fácil como cambiar el nombre del file.xhtmla file.html- servidor de aplicaciones tenido alguna extensión a MIME tipos de asignaciones fuera de la caja. Cuando el contenido es dinámico, puede configurar el tipo de contenido de respuesta de alguna manera (por ejemplo, res.setContentType("text/html")en la API de Servlet).
Puedes ver estas preguntas
Obtener HIERARCHY_REQUEST_ERR cuando se usa Javascript para generar recursivamente una lista anidada
o
Cuadro de diálogo jQuery UI con devolución de botones ASP.NET
La conclusión es
cuando intente usar la función append, debe usar una nueva variable, como este ejemplo
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"));
});En el ejemplo anterior, usa la var "dlg" para ejecutar la función appendTo. Entonces el error "HIERARCHY_REQUEST_ERR" no volverá a aparecer.
Encontré este error al usar la extensión de Google Chrome Sidewiki. Deshabilitarlo resolvió el problema para mí.
Voy a agregar una respuesta específica más aquí porque fue una búsqueda de 2 horas para la respuesta ...
Estaba tratando de inyectar una etiqueta en un documento. El html era así:
<map id='imageMap' name='imageMap'>
<area shape='circle' coords='55,28,5' href='#' title='1687.01 - 0 percentile' />
</map>Si observa, la etiqueta se cierra en el ejemplo anterior ( <area/>). Esto no fue aceptado en los navegadores Chrome. w3schools parece pensar que debería estar cerrado, y no pude encontrar la especificación oficial en esta etiqueta, pero seguro que no funciona en Chrome. Firefox no lo aceptará con <area/>o <area></area>o <area>. Chrome debe tener <area>. IE acepta cualquier cosa.
De todos modos, este error puede deberse a que su HTML no es correcto.
Sé que este hilo es antiguo, pero he encontrado otra causa del problema que otros pueden encontrar útil. Recibía el error con Google Analytics tratando de agregarse a un comentario HTML. El código ofensivo:
document.documentElement.firstChild.appendChild(ga);Esto estaba causando el error porque mi primer elemento fue un comentario HTML (es decir, un código de plantilla de Dreamweaver).
<!-- #BeginTemplate "/Templates/default.dwt.php" -->Modifiqué el código ofensivo a algo que ciertamente no es a prueba de balas, pero mejor:
document.documentElement.firstChild.nodeType===1 ? document.documentElement.firstChild.appendChild(ga) : document.documentElement.lastChild.appendChild(ga);Si se encuentra con este problema al intentar agregar un nodo a otra ventana en Internet Explorer, intente usar el HTML dentro del nodo en lugar del nodo en sí.
myElement.appendChild(myNode.html());IE no admite agregar nodos a otra ventana.
Este ERROR me ocurrió en IE9 cuando traté de agregar un niño dinámicamente a uno que ya existía en una ventana A. La ventana A crearía una ventana secundaria B. En la ventana B después de alguna acción del usuario, una función se ejecutaría y haría un appendChild en el elemento de formulario en la ventana A usando window.opener.document.getElementById('formElement').appendChild(input);
Esto arrojaría un error. Lo mismo ocurre con la creación del elemento de entrada utilizando document.createElement('input');en la ventana secundaria, pasándolo como un parámetro a la window.openerventana A, y allí se agrega. Solo si creara el elemento de entrada en la misma ventana donde iba a agregarlo, tendría éxito sin errores.
Por lo tanto, mi conclusión (verifique): ningún elemento puede crearse dinámicamente (usando document.createElement) en una ventana, y luego agregarse (usar .appendChild) a un elemento en otra ventana (sin dar quizás un paso adicional en particular que me perdí para asegurar que no se considere XML o algo). Esto falla en IE9 y arroja el error, aunque en FF esto funciona bien.
PD. No uso jQuery.
Otra razón por la que esto puede surgir es que está agregando antes de que el elemento esté listo, por ejemplo
<body>
<script>
document.body.appendChild(foo);
</script>
</body>
</html>En este caso, deberá mover el script después de. No estoy del todo seguro si eso es kosher, pero mover el script después del cuerpo no parece ayudar: /
En lugar de mover la secuencia de comandos, también puede agregarlos en un controlador de eventos.
Solo para referencia.
IE bloqueará la adición de cualquier elemento creado en un contexto de ventana diferente del contexto de ventana al que se está agregando el elemento.
p.ej
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'));Todavía no he descubierto cómo crear un elemento dom con jQuery usando un contexto de ventana diferente.
Me sale este error en IE9 si hubiera deshabilitado la opción de depuración de script (Internet Explorer). Si habilito la depuración de scripts, no veo el error y la página funciona bien. Esto parece extraño, ¿qué tiene que ver la excepción DOM con la depuración habilitada o deshabilitada?