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 相关文章推荐
IE和Firefox在JavaScript应用中的兼容性探讨
Apr 01 Javascript
ASP.NET jQuery 实例9  通过控件hyperlink实现返回顶部效果
Feb 03 Javascript
Javascript代码在页面加载时的执行顺序介绍
May 03 Javascript
ExtJs设置GridPanel表格文本垂直居中示例
Jul 15 Javascript
判断文档离浏览器顶部的距离的方法
Jan 08 Javascript
node.js中的fs.readFile方法使用说明
Dec 15 Javascript
js使用DOM设置单选按钮、复选框及下拉菜单的方法
Jan 20 Javascript
JS运动框架之分享侧边栏动画实例
Mar 03 Javascript
ng-options和ng-checked在表单中的高级运用(推荐)
Jan 21 Javascript
用js制作淘宝放大镜效果
Oct 28 Javascript
vue2.0 如何把子组件的数据传给父组件(推荐)
Jan 15 Javascript
vue2.0移动端滑动事件vue-touch的实例代码
Nov 27 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
2021年最新CPU天梯图
2021/03/04 数码科技
CodeIgniter框架中_remap()使用方法2例
2014/03/10 PHP
PHP实现删除非站内外部链接实例代码
2014/06/17 PHP
php中mysql连接方式PDO使用详解
2015/02/25 PHP
PHP微信开发之模板消息回复
2016/06/24 PHP
PHP获取文本框、密码域、按钮的值实例代码
2017/04/19 PHP
动态表单验证的操作方法和TP框架里面的ajax表单验证
2017/07/19 PHP
php递归函数怎么用才有效
2018/02/24 PHP
主页面中的两个iframe实现鼠标拖动改变其大小
2013/04/16 Javascript
jQuery动态地获取系统时间实现代码
2013/05/24 Javascript
浅谈json取值(对象和数组)
2016/06/24 Javascript
AngularJS入门教程之REST和定制服务详解
2016/08/19 Javascript
Angular 常用指令实例总结整理
2016/12/13 Javascript
javascript实现电脑和手机版样式切换
2017/11/10 Javascript
总结js中的一些兼容性易错的问题
2017/12/18 Javascript
浅谈webpack+react多页面开发终极架构
2018/11/11 Javascript
Vue-CLI 3.X 部署项目至生产服务器的方法
2019/03/22 Javascript
Vue组件通信的几种实现方法
2019/04/25 Javascript
JS浮点数运算结果不精确的Bug解决
2019/08/01 Javascript
JS实现页面侧边栏效果探究
2021/01/08 Javascript
Python的SQLAlchemy框架使用入门
2015/04/29 Python
Python制作简单的网页爬虫
2015/11/22 Python
Python+OpenCV人脸检测原理及示例详解
2020/10/19 Python
python梯度下降法的简单示例
2018/08/31 Python
Python实现把类当做字典来访问
2019/12/16 Python
python常用运维脚本实例小结
2020/02/14 Python
html5画布旋转效果示例
2014/01/27 HTML / CSS
记一次高分屏下canvas模糊问题
2020/02/17 HTML / CSS
Boden英国官网:英国知名原创时装品牌
2018/11/06 全球购物
团员个人的自我评价
2013/12/02 职场文书
淘宝中秋节活动方案
2014/01/31 职场文书
软件工程毕业生自荐信
2014/07/04 职场文书
2015年百日安全活动总结
2015/03/26 职场文书
2015年党总支工作总结
2015/05/25 职场文书
秋收起义观后感
2015/06/11 职场文书
校友会致辞
2015/07/30 职场文书