用JS将页面定位到某个位置(DIV)

使用Javascript自动将页面滚动到指定位置 
下面我们就来讲解一下如何使用Javascript自动将页面滚动到指定位置。 
指定需要滚动的位置 
这一步很简单,就是需要给滚动到指定位置的元素加上id属性,如下: 
天一广场 
使用Javascript自动将页面滚动到指定位置 
脚本如下: 

这就完成了我们的需求,经测试兼容所有主流浏览器。 
我也查阅了网上的一些资料,有的朋友说还有如下方式实现: 
我也对上面的方法进行了测试,发现使用javascript中的window.scrollBy()存在一个问题:每刷新一次页面,滚动距离顶部的高度都会比上次递增我们定义的scroll_y值。 
所以还是建议大家使用window.location.hash方法来自动将页面滚动到指定位置。 
<script type=”text/javascript”> $(function(){ window.location.hash = "#title"; }) </script> 
window.location 对象属性介绍: 
Location 对象属性 
属性          描述     IE F O 
hash 设置或返回从井号 (#) 开始的 URL(锚)。 4 1 9 
host 设置或返回主机名和当前 URL 的端口号。 4 1 9 
hostname 设置或返回当前 URL 的主机名。 4 1 9 
href 设置或返回完整的 URL。 4 1 9 
pathname 设置或返回当前 URL 的路径部分。 4 1 9 
port 设置或返回当前 URL 的端口号。 4 1 9 
protocol 设置或返回当前 URL 的协议。 4 1 9 
search 设置或返回从问号 (?) 开始的 URL(查询部分)。 4 1 9 

Location 对象方法 
属性 描述 IE F O 
assign() 加载新的文档。 4 1 9 
reload() 重新加载当前文档。 4 1 9 
replace() 用新的文档替换当前文档。 4 1 9 


History 对象 
History 对象包含用户(在浏览器窗口中)访问过的 URL。 
History 对象是 window 对象的一部分,可通过 window.history 属性对其进行访问。 
History 对象属性 
属性 描述 IE F O 
length 返回浏览器历史列表中的 URL 数量。 4 1 9 
History 对象方法 
方法 描述 IE F O 
back() 加载 history 列表中的前一个 URL。 4 1 9 
forward() 加载 history 列表中的下一个 URL。 4 1 9 
go() 加载 history 列表中的某个具体页面。 4 1 9 

History 对象描述 
History 对象最初设计来表示窗口的浏览历史。但出于隐私方面的原因,History 对象不再允许脚本访问已经访问过的实际 URL。唯一保持使用的功能只有 back()、forward() 和 go() 方法。

posted @ 2015-06-08 17:49  applekingghfhfhbr  阅读(6378)  评论(0编辑  收藏  举报