1 js控制锚点跳转

<a name="anchor"></a>

location.hash="anchor";

不只有a其他元素也可以,比如在报表中:
<tr id="tr1">...</tr>
location.hash="tr1"
或者用jQuery的动画滚动效果:
var id="tr1";
$('html,body').animate({scrollTop: $("tr#"+id).offset().top}, 500);

2 html控制锚点跳转

<a href="#btn">跳转到点击位置</a>
<a name="btn" id="btn" > 点击</a>

3跨页面锚点跳转

代码如下
<a href="123.html#btn">跳到btn</a>
<a name="btn" id="btn" > </a>

4js控制锚点跳转在HTML中实现方式

  1. <div id="divNode"><!-- contents --></div><!-- 假设一个需要跳转到的节点 -->
  2. <a href="#" onclick="document.getElemetnById('divNode').scrollIntoView(true);return false;">通过scrollIntoView实现锚点效果</a>

各种HTML锚点跳转方式的更多相关文章

  1. html锚点的作用和js选项卡锚点跳转的使用

    location是javascript里边管理地址栏的内置对象,比如location.href就管理页面的url,用location.href=url就可以直接将页面重定向url.而location. ...

  2. a 锚点跳转滑动效果

    点击a链接时,跳转到相应id的位置处,有一个滑动效果. <a href="#my">我是跳转到div</a><div id="my" ...

  3. HTML meta锚点跳转 小tips

    小tips meta锚点跳转 http://www.zhangxinxu.com/wordpress/2015/03/meta-http-equiv-refresh-content/

  4. JSP页面跳转方式

    JSP页面跳转方式 1.利用按钮+javascript进行跳转 <input type="button" name="button2" value=&qu ...

  5. zepto的scrollTo,实现锚点跳转

    实现功能:点击右侧字母A,实现锚点跳转功能: 有同学可能说可以直接用锚点跳转实现,是的,锚点跳转可以实现这个功能,但是有一个问题,点击跳转后,再点击返回,返回的是上次跳转的结果,具体的原理就不用多说了 ...

  6. ios中的界面跳转方式

    ios中,两种界面跳转方式 1.NavgationController本身可以作为普通ViewController的容器,它有装Controller的栈,所以可以push和pop它们,实现你所说的跳转 ...

  7. JS页面打开方式丶对话框及页面跳转方式

    一.js页面的三种打开方式 1. window.open 2. window.navigate("url") 跳转到目标页面 3. window.location.href=&qu ...

  8. JAVAEE学习——struts2_02:结果跳转方式、访问servletAPI方式、获得参数以及封装和练习:添加客户

    一.结果跳转方式 <action name="Demo1Action" class="cn.itheima.a_result.Demo1Action" m ...

  9. JSP的几种跳转方式的异同

    1 <jsp:foward page="url" /> 服务端跳转,立即跳转,后续语句不会执行: 2 <% response.sendRedirect(" ...

随机推荐

  1. 扩展 KMP

    扩展KMP解决这样一些问题: 给定两个字符串 S 和 T(长度分别为 n 和 m),下标从 0 开始,定义extend[i]等于S[i]...S[n-1]与 T 的最长相同前缀的长度,求出所有的ext ...

  2. (python功能定制)复杂的xml文件对比,产生HTML展示区别

    功能的设计初衷: 处理复杂的xml对比,屏蔽同节点先后顺序的影响 主要涉及知识点: 1.xml解析 ------- ElementTree库 2.文件比对差别 ------- difflib库 3.获 ...

  3. springIOC、AOP的一些注解

    springIOC.AOP的一些注解(使用这些注解之前要导入spring框架的一些依赖):    1.注入IOC容器        @Compontent:使用注解的方式添加到ioc容器需要在配置文件 ...

  4. Selenium_WebDriver_定位元素

    版权声明:本文为博主原创文章,转载请注明出处. 定位单个元素 WebDriver提供了八种元素定位方法,Java中定位语句形如:driver.findElement(By.id()): 何为元素定位? ...

  5. OpenLayer3调用天地图,拖拽后,地图消失的问题[已解决]

    拖拽后,地图直接消失了,而且右上角的坐标变成了NaN,NaN 后来经过测试发现,原来是自己封装有问题,坐标点一定要用parseFloat()转换下,但不清楚为什么页面刚开始加载的时候没有问题,总之能解 ...

  6. 集合的综合练习:Poker牌

    /* 刘意教程示例:*/ package cn.onecool.cot; import java.util.ArrayList; import java.util.Collections; impor ...

  7. docker 报错:x509: certificate has expired or is not yet valid

    环境:centos 7 程序:docker 下载镜像报错: # docker pull centos Pulling repository centos FATA[0004] Get https:// ...

  8. 关于DOM与BOM的总结

    1.什么是BOM,什么是DOM(基本概念) BOM: Browers Object MOdel           浏览器对象模型 DOM: Document Object MOdel         ...

  9. YUM安装软件

    YUM:介绍.工作流程.本地yum.网络yum.yum的相关命令 一.What is YUM YUM是基于rpm但更胜于rpm的软件管理工具 YUM的优点: 1.更方便的管理rpm软件包 2.自动解决 ...

  10. python入门学习笔记(一)

    写在开头:         A:python的交互式环境                                                                         ...