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. NIO基础篇(二)

    Selector(选择器)是Java NIO中能够检测一到多个NIO通道,并能够知晓通道是否为诸如读写事件做好准备的组件.这样,一个单独的线程可以管理多个channel,从而管理多个网络连接. 传统的 ...

  2. 51NOD 1222 最小公倍数计数 [莫比乌斯反演 杜教筛]

    1222 最小公倍数计数 题意:求有多少数对\((a,b):a<b\)满足\(lcm(a,b) \in [1, n]\) \(n \le 10^{11}\) 卡内存! 枚举\(gcd, \fra ...

  3. 把页面的Table直接输出到Excel文件中

    有个需求是统计的时候,为生成的html表格提供导出功能,但是这样导出Excel不会显示自身的表格 影响美观,但是excel会显示html的css样式,这里可以通过处理行对象的方式进行导出,但是处理起纵 ...

  4. [Python Study Notes]磁盘信息和IO性能

    ''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''' ...

  5. Java面试题库及答案解析

    1.面向对象编程(OOP)有哪些优点? 代码开发模块化,更易维护和修改. 代码复用. 增强代码的可靠性和灵活性. 增加代码的可理解性. 2.面向对象编程有哪些特性? 封装.继承.多态.抽象 封装 封装 ...

  6. ASP.NET Core的身份认证框架IdentityServer4--(4)添加第三方快捷登录

    添加对外部认证的支持 接下来我们将添加对外部认证的支持.这非常简单,因为你真正需要的是一个兼容ASP.NET Core的认证处理程序. ASP.NET Core本身也支持Google,Facebook ...

  7. 报错信息 The jsp:param action must not be used outside the jsp:include, jsp:forward, or jsp:params elements 的原因及解决办法

    如果你的代码是这样的话就会报错 <jsp:forward page="02.jsp"></jsp:forward> <jsp:param value= ...

  8. ch7复用类

    导出类的初始化是从基类开始向下扩展的,先初始化基类,再初始化由基类继承而来的类. 若类B需要类A中的一些甚至全部方法,但类B实际上不是并不是真正的类A,则可以通过代理的方式在B中实现所需要的A的方法, ...

  9. 用Open SSH生成公钥和私钥(Win)

    也可以使用 dsa 加密算法进行加密,命令如下: ssh-keygen -t dsa

  10. PHP动态编译出现Cannot find autoconf的解决方法

    wget http://ftp.gnu.org/gnu/m4/m4-1.4.9.tar.gz tar -zvxf m4-.tar.gz cd m4-/ ./configure && m ...