excepciones - javascript variable
¿Qué puede causar exactamente un "HIERARCHY_REQUEST_ERR: DOM Exception 3"-Error? (15)
¿Cómo se relaciona exactamente con jQuery? Sé que la biblioteca utiliza internamente las funciones de JavaScript, pero ¿qué intenta exactamente hacer cada vez que aparece un problema?
@Kelly Norton tiene razón en su respuesta de que The browser thinks the HTML you are attempting to append is XML
y sugiere specifying the content type when fetching via XHR
.
Sin embargo, es cierto que algunas veces usa bibliotecas de terceros que no va a modificar. Es JQuery UI en mi caso. Luego debe proporcionar el Content-Type
correcto en la respuesta en lugar de anular el tipo de respuesta en el lado de JavaScript. Establezca su tipo de Content-Type
en text/html
y text/html
bien.
En mi caso, fue tan fácil como cambiar el nombre del file.xhtml
a file.html
- el servidor de aplicaciones tenía alguna extensión a las asignaciones de tipos MIME file.xhtml
para file.xhtml
. Cuando el contenido es dinámico, puede establecer el tipo de contenido de la respuesta de alguna manera (por ejemplo, res.setContentType("text/html")
en Servlet API).
Específicamente, con jQuery puede encontrarse con este problema si olvida los enlaces de la etiqueta html al crear elementos:
$("#target").append($("div").text("Test"));
Levantará este error porque lo que usted quiso decir fue
$("#target").append($("<div>").text("Test"));
Este ERROR me sucedió en IE9 cuando traté de anexarChild dinámicamente a una 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, se ejecutaría una función 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ándola como un parámetro a la ventana window.opener
A, y allí aparece el append. Solo si crease el elemento de entrada en la misma ventana donde iba a anexarlo, tendría éxito sin errores.
Por lo tanto, mi conclusión (por favor verifique): ningún elemento puede ser creado dinámicamente (usando document.createElement
) en una ventana, y luego anexado (usando .appendChild
) a un elemento en otra ventana (sin tomar tal vez un paso adicional particular que fallé para asegurar no se considera XML o algo así). Esto falla en IE9 y arroja el error, en FF esto funciona bien sin embargo.
PD. No uso jQuery.
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
Me encontré con este error al utilizar la extensión de Google Chrome Sidewiki. Deshabilitarlo resolvió el problema para mí.
Obtengo este error en IE9 si hubiera desactivado la opción de depuración de scripts (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 hacer la excepción DOM con la depuración habilitada o deshabilitada?
Otra razón por la que esto puede aparecer es que usted se agrega 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 del todo seguro si eso es kosher, pero mover el guión después de que el cuerpo no parece ayudar: /
En lugar de mover el script, también puede agregarlo en un controlador de eventos.
Puedes ver estas preguntas
Obteniendo HIERARCHY_REQUEST_ERR al usar Javascript para generar recursivamente una lista anidada
o
jQuery UI Dialog con devolución de botón ASP.NET
La conclusión es
cuando intente usar la función anexar, debería 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 var "dlg" para ejecutar la función appendTo. Entonces el error "HIERARCHY_REQUEST_ERR" no volverá a salir.
Recibí ese error porque olvidé clonar mi elemento.
// creates an error
clone = $("#thing");
clone.appendTo("#somediv");
// does not
clone = $("#thing").clone();
clone.appendTo("#somediv");
Sé que este hilo es antiguo, pero me he encontrado con otra causa del problema que otros pueden encontrar útil. Estaba obteniendo 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 era 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 no es a prueba de balas, pero mejor:
document.documentElement.firstChild.nodeType===1 ? document.documentElement.firstChild.appendChild(ga) : document.documentElement.lastChild.appendChild(ga);
Si obtiene este error debido a un jquery ajax llame a $ .ajax
Entonces es posible que deba especificar qué tipo de datos está devolviendo el servidor. He solucionado la respuesta con esta simple propiedad.
$.ajax({
url: "URL_HERE",
dataType: "html",
success: function(response) {
$(''#ELEMENT'').html(response);
}
});
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.
myElement.appendChild(myNode.html());
IE no admite agregar nodos a otra ventana.
Significa que trataste de insertar un nodo DOM en un lugar en el á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 esto fue realmente intencionado:
document.body.appendChild(document.createElement(''div''));
Otras causas vistas en la naturaleza (resumidas a partir de comentarios):
- Está intentando agregar un nodo a sí mismo
- Está intentando agregar nulo a un nodo
- Está intentando agregar un nodo a un nodo de texto.
- Su HTML no es válido (por ejemplo, no cerrar su nodo objetivo)
- El navegador piensa que el código HTML que intenta adjuntar es XML (corríjalo agregando
<!doctype html>
a su HTML inyectado, o especificando el tipo de contenido al obtenerlo a través de XHR)
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 agrega 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''));
Aún no he descubierto cómo crear un elemento dom con jQuery utilizando un contexto de ventana diferente.
Voy a agregar una respuesta más específica aquí porque fue una búsqueda de 2 horas para la respuesta ...
Estaba intentando 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 nota, la etiqueta se cierra en el ejemplo anterior ( <area/>
). Esto no fue aceptado en los navegadores Chrome. w3schools parece pensar que debería cerrarse, 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.