代码改变世界

页面中利用JS定位到指定位置

2010-12-03 10:59  Peter Jin  阅读(3573)  评论(0编辑  收藏  举报

当页面内容非常多时,拖动页面滚动条很不方便,这时就可以利用JS定位到指定位置:

<input type="button" value="▼" onclick="location.href='#page_botom';" />
<input type="button" value="▲" onclick="location.href='#page_top';" />

 

【例】

 1 <html>
 2 <HEAD>
 3 <TITLE> New Document </TITLE>
 4 <META NAME="Generator" CONTENT="EditPlus">
 5 <META NAME="Author" CONTENT="">
 6 <META NAME="Keywords" CONTENT="">
 7 <META NAME="Description" CONTENT="">
 8 </HEAD>
 9 
10 <BODY>
11 <name="page_top" />
12 到后面去!
13 <input type="button" value="▼" onclick="location.href='#page_botom';" />
14 <TABLE border="1" align="center" width="750">
15 <TR>
16     <TD>Number</TD>
17     <TD>Name</TD>
18     <TD>Sex</TD>
19     <TD>Age</TD>
20     <TD>Nationality</TD>
21 </TR>
22 <TR>
23     <TD>001</TD>
24     <TD>Lucy</TD>
25     <TD>Female</TD>
26     <TD>22</TD>
27     <TD>American</TD>
28 </TR>
29 </TABLE>
30 <div style="height:900px"></div>
31 <name="page_botom" />
32 <hr/>
33 到前面去!
34 <input type="button" value="▲" onclick="location.href='#page_top';" />
35 <TABLE border="1" align="center" width="750">
36 <TR>
37     <TD>Number</TD>
38     <TD>Name</TD>
39     <TD>Sex</TD>
40     <TD>Age</TD>
41     <TD>Nationality</TD>
42 </TR>
43 <TR>
44     <TD>001</TD>
45     <TD>Lucy</TD>
46     <TD>Female</TD>
47     <TD>22</TD>
48     <TD>American</TD>
49 </TR>
50 </TABLE>
51 </BODY>
52 </HTML>