The same domain jquery (cross) IFRAME Operation Dom (instance explanation) _jquery

Frame is still very popular, many places through it to achieve a special situation. For example, traditional upload, select under IE6, Proxy, Cross-domain and so on. Today, a brief description of the operation across the IFRAME, mainly using jquery to manipulate the DOM structure.

Copy Code code as follows:

<iframe src= "a.php" id= "AA" ></iframe>
<iframe src= "b.php" id= "BB" ></iframe>
<input type= "button" id= "Read-aa" value= "read iframe #aa" >
<input type= "button" id= "Write-aa" value= "write to iframe #aa" >

Copy Code code as follows:

$ (' #read-aa '). Click (Function ()
{
var v=$ (' #aa '). Contents (). Find (' body '). html ();
Alert (v);
});
$ (' #write-aa '). Click (Function ()
{

$ (' #aa '). Contents (). Find (' div '). Append (' });

The main method is to contents (), read the IFRAME.

2. IFRAME operates IFRAME across parent frame

Copy Code code as follows:

<! DOCTYPE html>
<meta charset= "Utf-8" >
<title>bbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbb</title>
<script src= "Public/jquery.js" ></script>
<script>
$ (function ()
{
$ (' #read-parent-aa '). Click (Function ()
{
var v=$ (' body ', parent.document). Find (' #aa '). Contents (). Find (' body '). html ();
Alert (v);
});
$ (' #write-parent-aa '). Click (Function ()
{
$ (' body ', parent.document). "Find (' #aa ')." Contents (). Find (' div '). Append (' });
});
</script>
<div>
This is an IFRAME #bb里的内容
</div>
<input type= "button" id= "Read-parent-aa" value= "cross-parent read iframe #aa" >
<input type= "button" id= "Write-parent-aa" value= "cross-parent write iframe #aa" >

HTML: Code

Copy Code code as follows:

<! DOCTYPE html>
<meta charset= "Utf-8" >
<title>jquery Operation Iframe</title>
<script src= "Http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" ></script>
<iframe src= "a.php" id= "AA" ></iframe>
<iframe src= "b.php" id= "BB" ></iframe>
<input type= "button" id= "Read-aa" value= "read iframe #aa" >
<input type= "button" id= "Write-aa" value= "write to iframe #aa" >
<script>
$ (function ()
{
$ (' #read-aa '). Click (Function ()
{
var v=$ (' #aa '). Contents (). Find (' body '). html ();
Alert (v);
});
$ (' #write-aa '). Click (Function ()
{

$ (' #aa '). Contents (). Find (' div '). Append (' });
});
</script>