javascriptvoid(0)含义以及与"#"的区别讲解

 更新时间:2019年01月19日 10:37:13   作者:muzidigbig  
今天小编就为大家分享一篇关于javascriptvoid(0)含义以及与"#"的区别讲解,小编觉得内容挺不错的,现在分享给大家,具有很好的参考价值,需要的朋友一起跟随小编来看看吧

javascript:void(0) 中最关键的是 void 关键字, void 是 JavaScript 中非常重要的关键字,该操作符指定要计算一个表达式但是无返回值。

说明:

  • 1.javascript:void(0)这种伪协议,少写的好,如果你看过一些web标准的书就知道为什么了。(不懂,原话摘的,暂做记录)
  • 2.链接(href)直接使用javascript:void(0)在IE中可能会引起一些问题,比如:造成gif动画停止播放等,所以,最安全的办法还是使用“####”。为防止点击链接后跳转到页首,onclick事件return false即可。
  • 3.如果仅仅是想鼠标移过,变成手形,可以使用

<span style="cursor:pointer" onclick="foo()">Click Me!</span>  

推荐写法:javascript:;

为什么要使用href=”javascript:void(0);”

href=”javascript:void(0);”这个的含义是,让超链接去执行一个js函数,而不是去跳转到一个地址,而void(0)表示一个空的方法,也就是不执行js函数。

javascript:是伪协议,表示url的内容通过javascript执行。

void(0)表示不作任何操作,这样会防止链接跳转到其他页面。这么做往往是为了保留链接的样式,但不让链接执行实际操作,

<a href="javascript:void(0)" rel="external nofollow" rel="external nofollow" rel="external nofollow" onclick="window.open()"> 点击链接后,页面不动,只打开链接

<a href="#" rel="external nofollow" rel="external nofollow" rel="external nofollow" onclick="javascript:return false;"> 作用一样,但不同浏览器会有差异。

href=”#"的区别(谷歌浏览器)

<a href="javascript:void(0)" rel="external nofollow" rel="external nofollow" rel="external nofollow" >点击</a>点击链接后不会回到网页顶部

<a href="#" rel="external nofollow" rel="external nofollow" rel="external nofollow" >点击</a> 点击后会回到网面顶部,并会在地址栏的后面加个 #

"#"其实是包含了位置信息,例如默认的锚点是#top 也就是网页的上端

而javascript:void(0) 仅仅表示一个死链接这就是为什么有的时候页面很长浏览链接明明是#可是跳动到了页首

而javascript:void(0) 则不是如此所以调用脚本的时候最好用void(0)

使用javascript的方法(下面的这些用法会报错)

<a href="#" rel="external nofollow" rel="external nofollow" rel="external nofollow" onclick="javascript:方法;return false;">文字</a>

<a href="javascript:void(0)" rel="external nofollow" rel="external nofollow" rel="external nofollow" onclick="javascript:方法;return false;">文字</a>

补充 :<a href="javascript:fn();" rel="external nofollow" 这样点击a标签就可以执行fn()函数了。

若有不足请多多指教!希望给您带来帮助!

总结

以上就是这篇文章的全部内容了,希望本文的内容对大家的学习或者工作具有一定的参考学习价值,谢谢大家对脚本之家的支持。如果你想了解更多相关内容请查看下面相关链接

相关文章

  • JS中prototype关键字的功能介绍及使用示例

    JS中prototype关键字的功能介绍及使用示例

    prototype 关键字可以为JS原有对象或者自己创建的类中添加方法或者属性。也可以实现继承,下面以实例的方式为大家详细介绍下
    2013-07-07
  • JS遍历对象属性的方法示例

    JS遍历对象属性的方法示例

    这篇文章主要介绍了JS遍历对象属性的方法,涉及JS针对页面元素属性遍历操作的相关技巧,需要的朋友可以参考下
    2017-01-01
  • 在JavaScript中使用mqtt.js的详细过程

    在JavaScript中使用mqtt.js的详细过程

    这篇文章主要介绍了在JavaScript中使用mqtt.js的相关知识,本文给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下
    2023-04-04
  • 今天分享几个少见却很有用的 JS 技巧

    今天分享几个少见却很有用的 JS 技巧

    这篇文章主要介绍了今天分享几个少见却很有用的 JS 技巧,非常不错,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下
    2021-10-10
  • JS版图片放大镜效果

    JS版图片放大镜效果

    这篇文章主要为大家详细介绍了JS版的图片放大镜效果,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2021-09-09
  • JavaScript 命名空间 使用介绍

    JavaScript 命名空间 使用介绍

    使用JavaScript实现命名空间就没有这么舒服了,Javascript只有函数作用域,什么块儿啊、神马文件啊统统都认为是一个命名空间的,有时候因为一些重名问题导致的错误让人莫名其妙,难以调试解决
    2013-08-08
  • 关于__defineGetter__ 和__defineSetter__的说明

    关于__defineGetter__ 和__defineSetter__的说明

    关于__defineGetter__ 和__defineSetter__的说明...
    2007-05-05
  • 基于JS实现一个随机生成验证码功能

    基于JS实现一个随机生成验证码功能

    这篇文章主要介绍了基于JS实现一个随机生成验证码功能,随机生成一个四位数的验证码,本文通过实例代码给大家介绍的非常详细具有一定的参考借鉴价值,需要的朋友可以参考下
    2019-05-05
  • javascript性能优化之分时函数的介绍

    javascript性能优化之分时函数的介绍

    本篇文章主要介绍了javascript性能优化之分时函数的介绍,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2018-03-03
  • 浅析JavaScript中var that=this

    浅析JavaScript中var that=this

    this是Javascript语言的一个关键字。它代表函数运行时,自动生成的一个内部对象,只能在函数内部使用。接下来通过本文给大家分享JavaScript中var that=this所代表的意思,需要的朋友参考下吧
    2017-02-02

最新评论