js中javascript:void(0) 真正含义


Posted in Javascript onNovember 05, 2020

我们经常会使用到 javascript:void(0) 这样的代码,那么在 JavaScript 中 javascript:void(0) 代表的是什么意思呢?

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

语法格式如下:

void func()
javascript:void func()

或者

void(func())
javascript:void(func())

下面的代码创建了一个超级链接,当用户点击以后不会发生任何事。

实例

<a href="javascript:void(0)">单击此处什么也不会发生</a>

当用户链接时,void(0) 计算为 0,但 Javascript 上没有任何效果。

以下实例中,在用户点击链接后显示警告信息:

实例

<p>点击以下链接查看结果:</p>
<a href="javascript:void(alert('Warning!!!'))">点我!</a>

以下实例中参数 a 将返回 undefined :

实例

function getValue(){
  var a,b,c;
  a = void ( b = 5, c = 7 );
  document.write('a = ' + a + ' b = ' + b +' c = ' + c );
}

href="#"与href="javascript:void(0)"的区别
# 包含了一个位置信息,默认的锚是#top 也就是网页的上端。

而javascript:void(0), 仅仅表示一个死链接。

在页面很长的时候会使用 # 来定位页面的具体位置,格式为:# + id。

如果你要定义一个死链接请使用 javascript:void(0) 。

<a href="javascript:void(0);">点我没有反应的!</a>
<a href="#pos">点我定位到指定位置!</a>
<br>
...
<br>
<p id="pos">尾部定位点</p>

补充

void()仅仅是代表不返回任何值,但是括号内的表达式还是要运行,如

void(alert("Warnning!"))

// 阻止链接跳转,URL不会有任何变化
<a href="javascript:void(0)" rel="nofollow ugc">点击此处</a>

// 虽然阻止了链接跳转,但URL尾部会多个#,改变了当前URL。(# 主要用于配合 location.hash)
<a href="#" rel="nofollow ugc">点击此处</a>

// 同理,# 可以的话,? 也能达到阻止页面跳转的效果,但也相同的改变了URL。(? 主要用于配合 location.search)
<a href="?" rel="nofollow ugc">点击此处</a>

// Chrome 中即使 javascript:0; 也没变化,firefox中会变成一个字符串0
<a href="javascript:0" rel="nofollow ugc">点击此处</a>

下面是其他同学的补充

在Javascript中void是一个操作符,该操作符指定要计算一个表达式但是不返回值。

我想使用过ajax的都常见这样的代码:

<a href="javascript:doTest2();void(0);">here</a>

但这儿的void(0)究竟是何含义呢?

void 操作符用法格式如下:

1. javascript:void (expression)

2. javascript:void expression

expression 是一个要计算的 Javascript 标准的表达式。表达式外侧的圆括号是选的,但是写上去是一个好习惯。 (实现版本   Navigator 3.0   )

你以使用 void 操作符指定超级链接。表达式会被计算但是不会当前文档处装入任何内容。

下面的代码创建了一个超级链接,当用户以后不会发生任何事。当用户链接时,void(0) 计算为 0,但 Javascript 上没有任何效果。

<A HREF="javascript:void(0)">单此处什么也不会发生</A>

下面的代码创建了一个超级链接,用户单时会提交表单。

<A HREF="javascript:void(document.form.submit())">单此处提交表单</A>

a href=#与 a href=javascript:void(0) 的区别 链接的几种办法

#包含了一个位置信息

默认的锚是#top 也就是网页的上端

而javascript:void(0)   仅仅表示一个死链接

这就是为什么有的时候页面很长浏览链接明明是#是

跳动到了页首

而javascript:void(0) 则不是如此

所以调用脚本的时候最好用void(0)

或者<input onclick>

<div onclick>等

链接的几种办法

1.window.open(''url'')

2.用自定义函数

<script>
 function openWin(tag,obj)
 {
 obj.target="_blank";
 obj.href = "Web/Substation/Substation.aspx?stationno="+tag;
 obj.click();
 }
 </script>
<a href="javascript:void(0)" onclick="openWin(3,this)">株洲</a>
window.location.href=""

以上内容介绍了js中javascript:void(0) 真正含义,希望对大家今后的工作和学习有所帮助。

Javascript 相关文章推荐
javascript radio 联动效果
Mar 04 Javascript
Jquery知识点二 jquery下对数组的操作
Jan 15 Javascript
ExtJS4利根据登录后不同的角色分配不同的树形菜单
May 02 Javascript
Node.js中的缓冲与流模块详细介绍
Feb 11 Javascript
详细解密jsonp跨域请求
Apr 15 Javascript
jquery实现漂亮的二级下拉菜单代码
Aug 26 Javascript
使用jQuery ajaxupload插件实现无刷新上传文件
Apr 23 jQuery
Bootstrap Table使用整理(一)
Jun 09 Javascript
基于react组件之间的参数传递(详解)
Sep 05 Javascript
基于Axios 常用的请求方法别名(详解)
Mar 13 Javascript
vue-cli设置css不生效的解决方法
Feb 07 Javascript
卸载vue2.0并升级vue_cli3.0的实例讲解
Feb 16 Javascript
js实现三张图(文)片一起切换的banner焦点图
Aug 25 #Javascript
js焦点文字滚动效果代码分享
Aug 25 #Javascript
JS实现灵巧的下拉导航效果代码
Aug 25 #Javascript
基于jQuery实现仿百度首页换肤背景图片切换代码
Aug 25 #Javascript
jQuery实现类似标签风格的导航菜单效果代码
Aug 25 #Javascript
jQuery下拉美化搜索表单效果代码分享
Aug 25 #Javascript
jQuery实现下滑菜单导航效果代码
Aug 25 #Javascript
You might like
php设计模式 Builder(建造者模式)
2011/06/26 PHP
用来解析.htgroup文件的PHP类
2012/09/05 PHP
PHP 7的一些引人注目的新特性简单介绍
2015/11/08 PHP
PHP微信支付实例解析
2016/07/22 PHP
Laravel使用scout集成elasticsearch做全文搜索的实现方法
2018/11/30 PHP
PHP简单实现图片格式转换(jpg转png,gif转png等)
2019/10/30 PHP
用Jquery实现可编辑表格并用AJAX提交到服务器修改数据
2009/12/27 Javascript
document.getElementById方法在Firefox与IE中的区别
2010/05/18 Javascript
jquery动画4.升级版遮罩效果的图片走廊--带自动运行效果
2012/08/24 Javascript
简单的Jquery全选功能
2013/11/07 Javascript
JS window对象的top、parent、opener含义介绍
2013/12/03 Javascript
jQuery获取标签文本内容和html内容的方法
2015/03/27 Javascript
学习javascript面向对象 理解javascript对象
2016/01/04 Javascript
基于javascript实现tab切换特效
2016/03/29 Javascript
深入理解Ajax的get和post请求
2016/06/02 Javascript
Ionic快速安装教程
2016/06/03 Javascript
jQuery.cookie.js实现记录最近浏览过的商品功能示例
2017/01/23 Javascript
原生JS实现层叠轮播图
2017/05/17 Javascript
基于Vue实例生命周期(全面解析)
2017/08/16 Javascript
JavaScript实现滑动导航栏效果
2017/08/30 Javascript
JavaScript Canvas实现验证码
2020/08/02 Javascript
[50:38]DOTA2-DPC中国联赛 正赛 Phoenix vs CDEC BO3 第二场 3月7日
2021/03/11 DOTA
Python基于QRCode实现生成二维码的方法【下载,安装,调用等】
2017/07/11 Python
在python里从协程返回一个值的示例
2019/02/19 Python
python实现向微信用户发送每日一句 python实现微信聊天机器人
2019/03/27 Python
PYTHON EVAL的用法及注意事项解析
2019/09/06 Python
Python 剪绳子的多种思路实现(动态规划和贪心)
2020/02/24 Python
Tensorflow中批量读取数据的案列分析及TFRecord文件的打包与读取
2020/06/30 Python
详解CSS3中的box-sizing(content-box与border-box)
2019/04/19 HTML / CSS
html5 http的轮询和Websocket原理
2018/10/19 HTML / CSS
四方通行旅游网:台湾订房、出国旅游
2017/09/20 全球购物
技校毕业生个人学习的自我评价
2014/02/21 职场文书
大学军训的体会
2014/11/08 职场文书
2015个人年度工作总结范文
2015/05/28 职场文书
从QQtabBar看css命名规范BEM的详细介绍
2021/08/07 HTML / CSS
在python中读取和写入CSV文件详情
2022/06/28 Python