javascript當(dāng)中iframe的用法


馬克-to-win：frame在frameset中比較死板，iframe在div中可以在絕對的任何位置。



例 2.2.1（example1.html)
馬克- to-win：馬克 java社區(qū)：防盜版實名手機(jī)尾號： 73203。
<html>
<head>
    <meta http-equiv="content-type" content="text/html; charset=utf-8"/>
</head>
<body>
<div style="position:absolute;top: 20px; left:20px;">
    <iframe src="iframe2.html" id="tag" name="tag"
            width="250" height="100" scrolling="yes" frameborder="1">
    </iframe>
</div>

這有一行文本
<div style="position:absolute;top: 20px; left:300px;">
    <iframe src="iframe3.html" id="test3"
            width="450" height="300" scrolling="no" frameborder="1">
    </iframe>
</div>
<div style="position:absolute;top: 300px; left:200px;">
    <iframe src="iframe4.html" id="test3"
            width="450"  height="300" scrolling="no" frameborder="0">
    </iframe>
</div>
</body>
</html>



iframe2.html


<html>
<head>
    <meta http-equiv="content-type" content="text/html; charset=utf-8"/>
</head>
<body style="BACKGROUND-COLOR:red;">
<table width="50" height="20">
    <tr>
        <td>1</td>
    </tr>
    <tr>
        <td>2</td>
    </tr>
    <tr>
        <td>2</td>
    </tr>    <tr>
    <td>2</td>
</tr>    <tr>
    <td>2</td>
</tr>    <tr>
    <td>2</td>
</tr>    <tr>
    <td>2</td>
</tr>    <tr>
    <td>2</td>
</tr>    <tr>
    <td>2</td>
</tr>    <tr>
    <td>2</td>
</tr>    <tr>
    <td>2</td>
</tr>
</table>
</body>
</html>






iframe3.html



<html>
<head>
    <meta http-equiv="content-type" content="text/html; charset=utf-8"/>
</head>
<body style="">
<table width="150" height="20">
    <tr>
        <td>有border</td>
    </tr>
    <tr>
        <td>test2</td>
    </tr>
    <tr>
        <td>test2</td>
    </tr>
<tr>
        <td>test2</td>
    </tr>
<tr>
        <td>test2</td>
    </tr>
<tr>
        <td>test2</td>
    </tr>
<tr>
        <td>test2</td>
    </tr>
<tr>
        <td>test3</td>
    </tr>
<tr>
        <td>test4</td>
    </tr>
<tr>
        <td>test5</td>
    </tr>
</table>
</body>
</html>





iframe4.html



<html>
<head>
    <meta http-equiv="content-type" content="text/html; charset=utf-8"/>
</head>
<body style="">
<table width="150" height="20">
    <tr>
        <td>無border</td>
    </tr>
    <tr>
        <td>test2</td>
    </tr>
    <tr>
        <td>test2</td>
    </tr>
    <tr>
        <td>test2</td>
    </tr>
    <tr>
        <td>test2</td>
    </tr>
    <tr>
        <td>test2</td>
    </tr>
    <tr>
        <td>test2</td>
    </tr>
    <tr>
        <td>test3</td>
    </tr>
    <tr>
        <td>test4</td>
    </tr>
    <tr>
        <td>test5</td>
    </tr>
    <tr>
        <td>test6</td>
    </tr>
    <tr>
        <td>test7</td>
    </tr>
    <tr>
        <td>test8</td>
    </tr>
    <tr>
        <td>test9</td>
    </tr>
</table>
</body>
</html>






例 2.2.2（examplegood2.html)





<div class="left">
<ul>
   <li><a href="iframe3.html" target="bb">我不是賊</a></li>
   <li><a href="iframe2.html" target="bb">不是藥神</a></li>
</ul>
</div>

右邊是一個iframe，代碼：
<div class="right">
    <iframe name="bb"  src="iframe4.html" >
    </iframe>
</div>