O método de comunicação é diferente, dependendo se o atributo SRC no iframe está vinculado ao mesmo domínio ou link de domínio cruzado.
1. Comunicação entre páginas de pai e filho sob o mesmo domínio
Página pai parent.html
A cópia do código é a seguinte:
<html>
<head>
<script type = "text/javascript">
function diz () {
alerta ("parent.html");
}
função callchild () {
myframe.window.say ();
myframe.window.document.getElementById ("botão"). value = "chall end";
}
</script>
</head>
<Body>
<input id = "button" type = "button" value = "ligue para a função em Child.html diz ()" onclick = "callchild ()"/>
<iframe name = "myframe" src = "child.html"> </frame>
</body>
</html>
criança.html
A cópia do código é a seguinte:
<html>
<head>
<script type = "text/javascript">
function diz () {
alerta ("Child.html");
}
function CallParent () {
parent.Say ();
parent.window.document.getElementById ("botão"). value = "final de chamada";
}
</script>
</head>
<Body>
<input id = "button" type = "button" value = "ligue para a função Say () no pai.html" onclick = "callParent ()"/>
</body>
</html>
Chamada de método
A página pai chama o método da página infantil: Framename.window.childmethod ();
A página da criança chama o método da página pai: parent.window.parentmethod ();
Acesso ao elemento DOM
Depois de obter o objeto Window.Document da página, você pode acessar o elemento DOM.
Coisas a serem observadas
Para garantir que a operação seja executada após o carregamento do iframe, se o iframe ainda não tiver sido carregado, comece a chamar os métodos ou variáveis internas, ocorrerá um erro. Existem duas maneiras de determinar se um iframe está carregando:
1. Use Evento Onload no Iframe
2. Use Document.ReadyState == "Complete" para julgar
2. Método de comunicação de página de pai-filho entre dados cruzados
Se o iframe vincular uma página externa, o método de comunicação com o mesmo nome de domínio não poderá ser usado porque o mecanismo de segurança não será usado.
Página pai passa dados para páginas infantis
A técnica de implementação é usar o valor de hash do objeto de localização e passar dados de comunicação através dele. Adicione uma sequência de dados adicional após o SRC do iframe na página pai e, de alguma forma, você pode obter os dados aqui instantaneamente, por exemplo:
1. Defina o temporizador na subpagem através do método setInterval, ouça as mudanças no local.Href para obter as informações de dados acima
2. Em seguida, a subpagem executa o processamento lógico correspondente com base nessas informações de dados.
A página da criança passa dados para a página pai
A técnica de implementação é usar um proxy iframe, que está incorporado na página infantil e deve permanecer no mesmo domínio que a página pai. Em seguida, através dele, ele utiliza totalmente o princípio de implementação do primeiro método de comunicação acima, passa os dados da página criança para o proxy iframe. Então, como o proxy iframe e a página principal estão no mesmo domínio, a página principal pode obter esses dados usando o mesmo domínio. Use window.top ou window.parent.parent para obter uma referência ao objeto de janela de nível superior do navegador.