個人中心
退出
javascript當(dāng)中frame和frameset的用法
frame和frameset（企業(yè)用的少了，所以視頻略過，見后面iframe部分）
馬克- to-win：馬克 java社區(qū)：防盜版實(shí)名手機(jī)尾號： 73203。
例 2.1.1（index.html)
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title></title>
</head>
<!--col="221,*" means left column
is 221, right column is any value.frameborder="no" 就沒有border了-->
<frameset cols="221,*" frameborder="yes" border="1" bordercolor="#0066CC">
<frame src="left.html" name="leftFrame" scrolling="No" noresize="noresize" id="leftFrame" title="leftFrame" />
<frame src="main.html" name="mainFrame" id="mainFrame" title="mainFrame" />
</frameset>
<noframes>
<body>
noframes 元素可為那些不支持框架的瀏覽器顯示文本。noframes 元素位于 frameset 元素內(nèi)部。
</body>
</noframes></html>
left.html
<!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">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>無標(biāo)題文檔</title>
<script>
alert("left");
</script>
</head>
<body>
<!-- Window.parent (Property)
A reference to the parent window in a framed pane.
Window.frames[] (Collection)有關(guān)這個， 參見bottom.html
qixy: note that parent point to index.html which has a frameset, which has two framesets, one is frames[0], the other is frames[1]. so 1 is main.html.
Window.self (Property)
can refer to a frame as well as a window.
當(dāng)我在left.html中加一個斷點(diǎn)后， 我就發(fā)現(xiàn)這時的self,因?yàn)樵谧筮叺膄rame當(dāng)中， 所以指left.html
-->
<INPUT TYPE="button" value="parent測試" onclick="parent.frames[1].location='target1.html'">
<INPUT TYPE="button" value="self測試" onclick="self.location='target1.html'">
</body>
</html>
main.html
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE> New Document </TITLE>
<META NAME="Generator" CONTENT="EditPlus">
<META NAME="Author" CONTENT="">
<META NAME="Keywords" CONTENT="">
<META NAME="Description" CONTENT="">
</HEAD>
<!--rows="220,*" means : 220 is top frame's height, * means bottom frame is arbitrary value.-->
<frameset rows="220,*" framespacing="1" frameborder="yes" border="1" bordercolor="#0066CC">
<frame src="top.html" name="leftFrame" scrolling="No" noresize="noresize" id="leftFrame" title="leftFrame" />
<frame src="bottom.html" name="mainFrame" id="mainFrame" title="mainFrame" />
</frameset><noframes></noframes>
</HTML>
top.html
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE> New Document </TITLE>
<META NAME="Generator" CONTENT="EditPlus">
<META NAME="Author" CONTENT="">
<META NAME="Keywords" CONTENT="">
<META NAME="Description" CONTENT="">
</HEAD>
<BODY>
top.html
</BODY>
</HTML>
bottom.html
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE> New Document </TITLE>
<META NAME="Generator" CONTENT="EditPlus">
<META NAME="Author" CONTENT="">
<META NAME="Keywords" CONTENT="">
<META NAME="Description" CONTENT="">
</HEAD>
<script>
alert("abc");
</script>
<BODY>
<!--Window.top (Property)
The topmost window in a framed hierarchy.The top property should consistently refer to the window at the top of the hierarchy.在bottom.html中插入斷點(diǎn),當(dāng)我們運(yùn)行index.html, firebug 說window.top指index,html,但如果我們直接運(yùn)行bottom.html, top就指向bottom.html.
Window.frames[] (Collection)
An array containing window objects, each one referring to the content of a frame within the window.index.html有兩個frame，0
是left.html, 1是main.html.
-->
<INPUT TYPE="button" value="top測試" onclick="top.frames[0].location='target1.html'">
<INPUT TYPE="button" value="top.frames[1].frames[0]測試" onclick="top.frames[1].frames[0].location='target1.html'">
</BODY>
</HTML>
target1.html
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE> New Document </TITLE>
<META NAME="Generator" CONTENT="EditPlus">
<META NAME="Author" CONTENT="">
<META NAME="Keywords" CONTENT="">
<META NAME="Description" CONTENT="">
</HEAD>
<BODY>
target1.html
</BODY>
</HTML>
例 2.1.2（index.html)
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE> New Document </TITLE>
<META NAME="Generator" CONTENT="EditPlus">
<META NAME="Author" CONTENT="">
<META NAME="Keywords" CONTENT="">
<META NAME="Description" CONTENT="">
</HEAD>
<frameset rows="123,*" frameborder=no>
<frame src="logo.html" Scrolling=no>
<frame src="main.html" noresize>
</frameset>
</HTML>
logo.html
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE> New Document </TITLE>
<META NAME="Generator" CONTENT="EditPlus">
<META NAME="Author" CONTENT="">
<META NAME="Keywords" CONTENT="">
<META NAME="Description" CONTENT="">
</HEAD>
<BODY leftmargin="0" topmargin="0">
<IMG SRC="logo.jpg" WIDTH="1020" HEIGHT="123" BORDER="0" ALT="">
</BODY>
</HTML>
main.html
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8"/>
<TITLE> New Document </TITLE>
<META NAME="Generator" CONTENT="EditPlus">
<META NAME="Author" CONTENT="">
<META NAME="Keywords" CONTENT="">
<META NAME="Description" CONTENT="">
</HEAD>
<!-- 1,4意味著左邊和右邊的比例是1:4 -->
<FRAMESET COLS="1,4">
<FRAME SRC="left.html" NAME="left">
<FRAME SRC="right.html" NAME="right">
</FRAMESET>
</HTML>
left.html
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8"/>
<TITLE> New Document </TITLE>
<META NAME="Generator" CONTENT="EditPlus">
<META NAME="Author" CONTENT="">
<META NAME="Keywords" CONTENT="">
<META NAME="Description" CONTENT="">
</HEAD>
<BODY>
<!--Anchor.target (Property)
In MSIE the Url.target property is also available as the Anchor.target property.
Property/method value type: String primitive
JavaScript syntax: - myAnchor.target
- myAnchor.target = newTarget
HTML syntax: <A TARGET="...">
This yields the value of the TARGET attribute in an <A>, <AREA> or <MAP> tag.
You can assign a new value to this property so that the URL will be directed to a different window or frame.
Here are some example target values:
_parent: immidiate parent.
_self: is self frame.
_top: the topmost window.
_blank: qixy: a new window.
Window name
Frame name
-->
<A HREF="first.html" target="_blank">測試_blank</A><P>
<A HREF="first.html" target="_self">測試_self</A><P>
<A HREF="first.html" target="_parent">測試_parent</A><P>
<A HREF="first.html" target="_top">測試_top</A><P>
</BODY>
</HTML>
first.html
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8"/>
<title>我的主頁</title>
</head>
<body>
這是我的第一個網(wǎng)頁！
</body>
</html>
right.html
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE> New Document </TITLE>
<META NAME="Generator" CONTENT="EditPlus">
<META NAME="Author" CONTENT="">
<META NAME="Keywords" CONTENT="">
<META NAME="Description" CONTENT="">
</HEAD>
<BODY>
</BODY>
</HTML>
分類導(dǎo)航