该方法用于建立一个锚点,点击锚点,会跳到相应的内容,且该内容头部与浏览器头部平齐

实例:


<html>
<head>
<title>TODO supply a title</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>
<body>
<a onClick="onc()">dasdasd</a>
<div style="width:400px; height:400px; border: 1px solid #f00;"></div>
<div id="nn" style="border:1px solid #666">
<div style="height:900px;">sadasdasd</div>
</div>
</body>
<script type="text/javascript">
//作为一个事件的函数来被调用
function onc () {
var dd = document.getElementById("nn").scrollIntoView(true); //这个意思其实就是将这个元素到顶部来浏览器窗口的顶部来显示
}
</script>
</html>

 

scrollIntoView()方法的更多相关文章

  1. 如何定位到append的当前位置,不用拉滚动条scrollIntoView方法

    var bb_mes_con = $('bb_mes_con'); var mes_html = document.createElement('div'); mes_html.setAttribut ...

  2. 利用scrollintoview方法模拟聊天室收到新消息

    这段时间再写一个聊天的功能,基本的原理已经通了,剩下的就是细化功能和实现了.原理通了不代表就能解决了这个问题,今天就遇到了一个小问题,就是在接收到新的消息以后,最新的消息不能显示在消息区域,而是跑到了 ...

  3. javascript通过改变滚动条滚动来显示某些元素的scrollIntoView()方法

    scrollIntoView(b)可以在任何HTML上调用,通过滚动滚动条,调用的元素就可以出现在可视区域. 参数如果是true,或者不传参数,则表示调用元素的顶部与浏览器顶部平齐. 如果传入fals ...

  4. [聊天框]让DIV的滚动条自动滚动到最底部 - 4种方法

    要制作一个在线聊天的程序,在做最后的修饰时,需要对获得的信息即时滚动以保证用户总能看到最新消息. 聊天程序是基于AJAX设计的,没有用框架,消息容器是一个DIV,所以问题就在于如何控制DIV的滚动条. ...

  5. 让DIV的滚动条自动滚动到最底部 - 4种方法

    方法一:使用锚标记要滚动到的位置,然后通过click方法模拟点击滚动到锚所在位置 <script language="javascript1.2" type="te ...

  6. 关于input的一些问题解决方法分享

    前言 input是我们接受来自用户的数据常用标签,在前端开发中,相信每个人都会用到这个标签,所以在开发过程中也时候也会遇到一些问题,本文的内容是我在跟input相爱相杀过程中产生的,在此记录分享一下. ...

  7. Element.scrollIntoView()

    Element.scrollIntoView() 方法让当前的元素滚动到浏览器窗口的可视区域内 语法 element.scrollIntoView(); element.scrollIntoView( ...

  8. WebBrowser常用属性方法介绍

    WebBrowser 常用属性方法 ■■方法 ==============================  ▲GoBack    相当于IE的"后退"按钮,使你在当前历史列表中后 ...

  9. 走进javascript——被忽视的DOM方法和属性

    isEqualNode() isEqualNode方法可以用来判断两个DOM节点是否相同,给我的第一感觉是没用,因为两个DOM的比较很容易让人想成是字符串的比较,心想直接用两个等号不就可以了吗,但马上 ...

随机推荐

  1. pyqt5安装命令

    第一步:安装qt5 pip install pyqt5==5.10.1 -i https://pypi.doubanio.com/simple pip install pyqt5-tools -i h ...

  2. 成功解决You are using pip version 9.0.1, however version 9.0.3 is available. You should consider upgra

    解决问题 You are using pip version 9.0.3, however version 10.0.1 is available.You should consider upgrad ...

  3. Oracle DB 使用子查询来解决查询

    • 定义子查询 • 描述子查询可以解决的问题类型 • 列出子查询的类型 • 编写单行和多行子查询   • 子查询:类型.语法和准则 • 单行子查询: – 子查询中的组函数 – 带有子查询的HAVING ...

  4. python爬虫基本原理及入门

    爬虫:请求目标网站并获得数据的程序 爬虫的基本步骤: 使用python自带的urllib库请求百度: import urllib.request response = urllib.request.u ...

  5. 【LeetCode】最大子序列和

    要求时间复杂度 O(n). e.g. 给定数组 [-2,1,-3,4,-1,2,1,-5,4],其中有连续子序列 [4,-1,2,1] 和最大为 6. 我完全没有想法,看了答案. C++实现: int ...

  6. provider和consumer配置参数的优先级

    <dubbo:service>和<dubbo:reference>存在一些相同的参数,例如:timeout,retries等,那么哪个配置的优先级高呢? consumer合并u ...

  7. JSP调试技巧

    我先谈谈: 我的经验就是多装几个服务器,这个查不出错误,用另一个,这个方法很好用. ---------------------------------------------------------- ...

  8. Sql server中 如何用sql语句创建视图

    1.视图的作用 视图的作用: 第一点:使用视图,可以定制用户数据,聚焦特定的数据. 解释: 在实际过程中,公司有不同角色的工作人员,我们以销售公司为例的话, 采购人员,可以需要一些与其有关的数据,而与 ...

  9. Python 自然语言处理笔记(一)

    一. NLTK的几个常用函数 1. Concordance 实例如下: >>> text1.concordance("monstrous") Displaying ...

  10. node代理服务器

    var express = require('express');var request = require('request');var app = express();var _URL = 'ht ...