a标签空链接href=#与href=javascript:void(0)的区别 | 您所在的位置:网站首页 › a标签中的href为空出现的问题 › a标签空链接href=#与href=javascript:void(0)的区别 |
我们在使用a标签的空链接时,通常写为 href=# 或者 href=javascript:void(0) ,这两种写法有什么区别呢?我想很多人都不会去深究,但是这两种写法出来的效果有时候是不一样的。 概括来说,这两种写法有如下几个区别: # 包含了一个位置信息,默认的锚是 #top 也就是网页的上端。即是说,当 href=# 的空链接被点击时,页面会跳到最顶端。 而 javascript:void(0) 仅仅表示一个死链接,当 href=javascript:void(0) 的空链接被点击时,页面不会有任何反应。 在页面很长的时候会使用 # 来定位页面的具体位置,格式为:# + id。 如果你要定义一个死链接请使用 javascript:void(0) 。下面实例代码演示上述1、2点的区别: a标签空链接href=#与href=javascript:void(0)的区别 空链接: href=#空链接: href=javascript:void(0) execcodegetcode 使用 # 来定位页面的具体位置的实例代码: a标签空链接href=#与href=javascript:void(0)的区别 跳到目标位置: href=#p1 目标位置:id="p1" execcodegetcode 为什么要使用href=”javascript:void(0);”为什么要使用href=”javascript:void(0);”,javascript:void(0) 什么时候使用? href=”javascript:void(0);” 的含义是,让超链接去执行一个js函数,而不是去跳转到一个地址,而void(0)表示一个空的方法,也就是不执行js函数。 javascript:是伪协议,表示url的内容通过javascript执行。void(0)表示不作任何操作,这样会防止链接跳转到其他页面。这么做往往是为了保留链接的样式,但不让链接执行实际操作。下面的语句: 点击链接后,页面不动,只打开链接。而下面的语句: 作用一样,但不同浏览器会有差异。 多数情况下,当某一链接要执行一个javascript程序时,我们可以使用href=javascript:void(0)再加上onclick事件来实现,如下面实例代码: a标签空链接href=#与href=javascript:void(0)的区别 点击执行函数func() function func(){ alert("ok");}execcodegetcode javascript:;与javascript:void(0)的理解void运算符简介: void 是 javascript 的操作符,意思是:只执行表达式,但没有返回值。该表达式会被计算但是不会在当前文档处装入任何内容,例如,void(0) 计算为 0 ,但在JavaScript上没有任何效果,也就是说 的作用和 的作用是一样的。 void 操作符用法格式如下: javascript:void (表达式) //推荐此写法javascript:void 表达式 点击链接的操作做页面时,如果想做一个链接点击后不做任何事情,或者响应点击而完成其他事情,例如点击链接后不做任何事情,代码如下: test //点击链接,页面默认上滚到页的顶部,但可以加上 onclick="return false",防止上滚到页的顶部test //使用2个到4个#,见的大多是"####",也有使用"#all"等其他的。默认不上滚到页的顶部test //新浪微博写法,javascript:void(0) 仅仅表示一个死链接,执行空事件test //QQ空间写法 点击链接后,响应用户自定义的点击事件 test //其中func() 是 javascript 方法,即函数 //什么问题都解决了,包括浏览器不兼容问题 或者直接使用href="" test ajax 之 void(0)在 Ajax 中,都会常见如下的代码: here 但这里的void(0)究竟是何含义呢? Javascript中void是一个操作符,该操作符指定要计算一个表达式但是不返回值。 在 Ajax 的页面,实现的是无刷新操作,使用 void(0)也 比较多。看一下Ajax的web页面的话,一般都会看到有很多的void(0),所以在使用void(0)之前,好先想一想,这个页面是否需要整体刷新。 href="#" 的情况处理做页面时,如果是个# ,就会出现跳到顶部的情况,个人收藏的几种解决方法,其中,"#" 包含了一个位置信息,默认的锚点是#top 也就是网页的上端。 (好像在FF中不能显示) 相关文章 怎样去掉a标签点击时的虚线边框 |
CopyRight 2018-2019 实验室设备网 版权所有 |