A função do elemento iframe é incorporar um documento dentro de um documento e criar um quadro flutuante. Muitas pessoas não entendem muito bem como o iframe é controlado e basicamente ainda estão em um vago estado de compreensão.
Duas notas sobre iframes, ifr é o valor de ID e NOME de um iframe existente:
O seguinte é um fragmento entre aspas:
document.getElementById(“ifr”);
window.frames[“ifr”];
variável
deve passar pelo segundo método, pois é necessário um modelo DOM completo (não sei se isso está correto).
só quero Para alterar o src ou borda do iframe, rolagem e outros atributos (que não são o mesmo conceito de propriedade, a propriedade não pode ser escrita em tags, como: scrollHeight, innerHTML, etc.), você precisa usar o primeiro método.
Se você deseja obter a página do iframe (não o iframe em si), você precisa usar o segundo método, pois ele obtém um modelo DOM completo. Por exemplo, se você deseja obter o conteúdo do document.body do. iframe, você só pode usar o segundo método.
Observe também que se Quando a página do iframe não estiver totalmente carregada, ocorrerá um erro grave ao chamar o modelo DOM do iframe
. , um é aa.htm e o outro é bb.htm!
aa .htm
code: A seguir está um fragmento de citação:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" " http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd ">
<html xmlns=" http://www.w3.org/1999/xhtml " >
<cabeça>
<title>Página sem título</title>
<style type="texto/css">
<!--
corpo{
margem:0px;
}
-->
</estilo>
</head>
<corpo>
<iframe id="ifr" name="ifr" width="100%" height="500" src="bb.htm"></iframe>
</body>
</html>
<linguagem script="javascript" type="text/javascript">
var aa_value="Sou uma variante na janela superior!";
var ifr_id=document.getElementById("ifr");
var ifr_window=window.frames["ifr"];
alert("Alerta da janela superior: Não é possível obter a variante do iframe por ifr_id, ele retornará:" + ifr_id.bb_var);
alert("Alerta da janela superior: não é possível obter o modelo DOM do iframe por ifr_id, ele retornará:" + ifr_id.window);
alert("Alerta da janela superior: Obtenha src do id:" + ifr_id.src);
alert("Alerta da janela superior: Obtenha href da janela:" + ifr_window.document.location.href);
//Como o bb.htm pode ainda não ter sido carregado, o download pode causar um erro.
//Chama a função ifr_window.bb() no iframe;
//Chama variáveis dentro do iframe
alert("Alerta da janela superior: " + ifr_window.bb_var);
//
alert("Alerta da janela superior:" + ifr_window.document.body.innerHTML);
função aa(mensagem){
alert("Estou alertando pela janela superior e recebi uma mensagem:n" + msg);
}
</script>
bb.htm
Código: O seguinte é um trecho citado:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" " http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd ">
<html xmlns=" http://www.w3.org/1999/xhtml " >
<cabeça>
<title>subquadro</title>
<style type="texto/css">
<!--
html,corpo{
margem:0px;
largura:90%;
}
-->
</estilo>
</head>
<corpo>
Eu sou um subquadro!
<br />
...<br />
...<br />
...<br />
...<br />
...<br />
...<br />
...<br />
...<br />
...<br />
...<br />
...<br />
...<br />
...<br />
...<br />
...<br />
...<br />
...<br />
...<br />
...<br />
...<br />
...<br />
...<br />
...<br />
...<br />
...<br />
...<br />
...<br />
...<br />
...<br />
...<br />
...<br />
...<br />
...<br />
...<br />
...<br />
...<br />
...<br />
...<br />
...<br />
...<br />
...<br />
...
</body>
</html>
<linguagem script="javascript" type="text/javascript">
var bb_var="Sou uma variável em ifr";
funçãobb(){
alert("Alerta do iframe: sou a função do frame ifr")
}
//Obtém as variáveis da página pai
alert("Alerta do iframe parent.ifr_id::" + parent.ifr_id);
alert("Alerta do iframe parent.aa_value: " + parent.aa_value);
//Altera a altura do iframe através do ifr_id da página pai
alert("Alerta do iframe: clientHeight do ifr:" +document.body.clientHeight);
parent.ifr_id.height=document.body.clientHeight;
alert("Alerta do iframe: scrollHeight do ifr: " + document.body.scrollHeight);
//Chama a função do formulário pai:
parent.aa("Vou chamar uma função que é a janela superior");
//Alterar o título do formulário pai:
alert("Alerta do iframe: vou alterar o título da janela superior");
top.document.title="O valor do título foi alterado";
//A borda e a rolagem foram alteradas através do ifr_id do formulário pai
alert("Alerta do iframe: vou mudar minha borda e rolagem:");
topo.ifr_id.border=0;
top.ifr_id.scrolling="não";
</script>