Como exatamente isso se relaciona com o jQuery? Sei que a biblioteca usa funções nativas de javascript internamente, mas o que exatamente ela está tentando fazer sempre que esse problema aparece?
Como exatamente isso se relaciona com o jQuery? Sei que a biblioteca usa funções nativas de javascript internamente, mas o que exatamente ela está tentando fazer sempre que esse problema aparece?
Respostas:
Isso significa que você tentou inserir um nó DOM em um local na árvore DOM para onde ele não pode ir. O lugar mais comum é o Safari, que não permite o seguinte:
document.appendChild(document.createElement('div'));Geralmente, este é apenas um erro em que isso foi realmente planejado:
document.body.appendChild(document.createElement('div'));Outras causas vistas na natureza (resumidas nos comentários):
<!doctype html>ao HTML injetado ou especificando o tipo de conteúdo ao buscar por XHR)response.xmlquando disponível. Por exemplo,$(e).append(response.xml || $(response));
Se você está recebendo este erro devido a uma chamada de jquery ajax, $ .ajax
Talvez seja necessário especificar o que o dataType está retornando do servidor. Corrigi muito a resposta usando essa propriedade simples.
$.ajax({
url: "URL_HERE",
dataType: "html",
success: function(response) {
$('#ELEMENT').html(response);
}
});Este erro pode ocorrer quando você tenta inserir um nó no DOM que é HTML inválido, que pode ser algo tão sutil quanto um atributo incorreto, por exemplo:
// <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 está certo em sua resposta The browser thinks the HTML you are attempting to append is XMLe sugere specifying the content type when fetching via XHR.
É verdade, porém, às vezes você usa bibliotecas de terceiros que não vai modificar. É JQuery UI no meu caso. Em seguida, você deve fornecer o direito Content-Typena resposta em vez de substituir o tipo de resposta no lado do JavaScript. Defina seu Content-Typecomo text/htmle você está bem.
No meu caso, foi tão fácil como mudar o nome do file.xhtmlpara file.html- servidor de aplicativos tiveram algum extensão MIME tipos de mapeamentos de fora da caixa. Quando o conteúdo é dinâmico, você pode definir o tipo de resposta do conteúdo de alguma forma (por exemplo, res.setContentType("text/html")na API do Servlet).
Você pode ver essas perguntas
Obtendo HIERARCHY_REQUEST_ERR ao usar Javascript para gerar recursivamente uma lista aninhada
ou
Diálogo da UI do jQuery com postagem do botão ASP.NET
A conclusão é
ao tentar usar o acréscimo de função, você deve usar nova variável, como este exemplo
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"));
});No exemplo acima, usa o var "dlg" para executar a função appendTo. O erro "HIERARCHY_REQUEST_ERR" não será exibido novamente.
Encontrei este erro ao usar a extensão do Google Chrome Sidewiki. Desativá-lo resolveu o problema para mim.
Vou adicionar mais uma resposta específica aqui, porque foram duas horas de busca pela resposta ...
Eu estava tentando injetar uma tag em um documento. O html era assim:
<map id='imageMap' name='imageMap'>
<area shape='circle' coords='55,28,5' href='#' title='1687.01 - 0 percentile' />
</map>Se você notar, a tag está fechada no exemplo anterior ( <area/>). Isso não foi aceito nos navegadores Chrome. O w3schools parece achar que deveria estar fechado e não consegui encontrar as especificações oficiais dessa tag, mas com certeza não funciona no Chrome. O Firefox não aceita com <area/>ou <area></area>ou <area>. O Chrome deve ter <area>. IE aceita qualquer coisa.
De qualquer forma, esse erro pode ocorrer porque seu HTML não está correto.
Sei que este tópico é antigo, mas encontrei outra causa do problema que outras pessoas podem achar útil. Eu estava recebendo o erro com o Google Analytics tentando anexar-se a um comentário em HTML. O código incorreto:
document.documentElement.firstChild.appendChild(ga);Isso estava causando o erro porque meu primeiro elemento foi um comentário em HTML (ou seja, um código de modelo do Dreamweaver).
<!-- #BeginTemplate "/Templates/default.dwt.php" -->Modifiquei o código incorreto para algo reconhecidamente não à prova de balas, mas melhor:
document.documentElement.firstChild.nodeType===1 ? document.documentElement.firstChild.appendChild(ga) : document.documentElement.lastChild.appendChild(ga);Se você enfrentar esse problema ao tentar anexar um nó a outra janela no Internet Explorer, tente usar o HTML dentro do nó em vez do próprio nó.
myElement.appendChild(myNode.html());O IE não suporta anexar nós a outra janela.
Esse erro aconteceu comigo no IE9 quando tentei anexar uma criança dinamicamente a uma que já existia em uma janela A. A janela A criaria uma janela filho B. Na janela B, após alguma ação do usuário, uma função seria executada e executaria uma appendChild no elemento de formulário na janela A usando window.opener.document.getElementById('formElement').appendChild(input);
Isso geraria um erro. O mesmo ocorre com a criação do elemento de entrada usando document.createElement('input');na janela filho, passando-o como um parâmetro para a window.openerjanela A e, em seguida, o anexo. Somente se eu criar o elemento de entrada na mesma janela em que o anexaria, ele será bem-sucedido sem erros.
Assim, minha conclusão (verifique): nenhum elemento pode ser criado dinamicamente (usando document.createElement) em uma janela e, em seguida, anexado (usando .appendChild) a um elemento em outra janela (sem dar talvez uma etapa extra específica que perdi para garantir que ele não seja considerado XML ou alguma coisa). Isso falha no IE9 e gera o erro, no FF isso funciona bem.
PS. Eu não uso jQuery.
Outro motivo para isso acontecer é que você está anexando antes que o elemento esteja pronto, por exemplo
<body>
<script>
document.body.appendChild(foo);
</script>
</body>
</html>Nesse caso, você precisará mover o script após o. Não tenho certeza se isso é kosher, mas mover o script após o corpo não parece ajudar: /
Em vez de mover o script, você também pode fazer o acréscimo em um manipulador de eventos.
Somente para referência.
O IE bloqueará a adição de qualquer elemento criado em um contexto de janela diferente do contexto da janela ao qual o elemento está sendo anexado.
por exemplo
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'));Ainda não descobri como criar um elemento dom com jQuery usando um contexto de janela diferente.
Eu recebo esse erro no IE9 se eu tiver desativado a opção de depuração de scripts (Internet Explorer). Se eu ativar a depuração de script, não vejo o erro e a página funciona bem. Parece estranho o que a exceção do DOM tem a ver com a depuração ativada ou desativada.