javascript:void(0)的含义及用法实例

更新时间：2021年12月13日 11:09:39 作者：小方哥·

这篇文章介绍了javascript:void(0)的含义及用法实例，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧

void关键字介绍

首先，void关键字是javascript当中非常重要的关键字，该操作符指定要计算或运行一个表达式，但是不返回值。

语法格式：

void func()
void(func())

实例1

当点击超级链接时，什么都不发生

<!-- 1.当用户链接时，void(0)计算为0,用户点击不会发生任何效果 -->
    <a href="javascript:void(0);" rel="external nofollow"  rel="external nofollow" >单击此处什么都不会发生</a><br>

实例2

执行void操作符当中的代码

<!-- 2.执行 void() 操作符中的代码 -->
    <a href="javascript:void(alert('还真点啊你，真听话！！！哈哈哈！！！'))" rel="external nofollow" >点我弹出警告框!!!</a><br>
    <a href="javascript:void(console.log('还真点啊你，真听话！！！哈哈哈！！！'))" rel="external nofollow" >点我输出到控制台!!!</a><br>

实例3

计算void操作符当中的算术

html:

<button type="button">点我</button>

js:

<script type="text/javascript">
        document.querySelector('button').addEventListener('click', function () {
            var a, b, c, d;
            a = void(b = 2, c = 3);
            console.log('a => ' + a);
            console.log('b => ' + b);
            console.log('c => ' + c);
            console.log('d => ' + d);
        });
    </script>

控制台输出：

很显然，2赋值给了a, 3赋值给了b, a 和 d一样只是定义了没有赋值，所以为 undefined

# 与 javascript:void(0)的区别:

#可以跳转到设置了id的目的地

javascript:void(0)则停留在原地，一动不动，我们称之为“死链接”

如下面这个例子：

<a href="javascript:void(0);" rel="external nofollow"  rel="external nofollow" >你点吧，反正我就是不动，嘿嘿嘿！！！</a><br>
    <a href="#destination" rel="external nofollow" >点我跳转</a>
    <br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
    <br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
    <br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
    <br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
    <br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
    <br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
    <h2 id="destination">目的地</h2>

当点击第一个链接时，一动不动
当点击第二个连接时，会跳转到指定id得位置（页面最底部）

到此这篇关于javascript:void(0)的含义及用法实例的文章就介绍到这了。希望对大家的学习有所帮助，也希望大家多多支持脚本之家。

您可能感兴趣的文章:

深入剖析JavaScript:Object类型
下面小编就为大家带来一篇深入剖析JavaScript:Object类型。小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧
2016-05-05
Javascript基础回顾之(一) 类型
本系列所有内容都是涉及Javascript基础的，没有时髦的玩意儿，但是我相信这些基础的东西会有助于你理解那些有趣的东西的
2017-01-01
PHP 数组current和next用法分享
本文这里通过示例给大家简单对比分析了PHP 数组current和next的用法，虽然示例很简单，但是对于我们理解current和next非常有帮助，这里推荐给大家。
2015-03-03
C#中对象与JSON字符串互相转换的三种方式
这篇文章介绍了C#中对象与JSON字符串互相转换的三种方式，文中通过示例代码介绍的非常详细。对大家的学习或工作具有一定的参考借鉴价值，需要的朋友可以参考下
2022-07-07
JavaScript中window、doucment、body的解释
JavaScript中window、doucment、body是什么意思呢，下面为大家做个介绍，不知道的朋友可以参考下
2013-08-08
JavaScript中的异步与同步详解
这篇文章主要介绍了JavaScript中的异步与同步详解,如果一个线程在一个节点中添加内容，另一个线程要删除这个节点,所以为了不必要的麻烦，js就是一门单线程语言,需要的朋友可以参考下
2023-07-07
js在IE与firefox的差异集锦
文章汇总了js在IE与Firefox环境下的差异，以及出现问题如何解决的方法，非常的详尽，也很实用，有需要的小伙伴自己拿走
2014-11-11
javascript弹出窗口 window.open使用方法以及参数说明分析篇
window.open是网页中经常遇到的弹出窗口代码，不是网络中比较反感的那类弹出代码。用于新页面传值，回传等。
2009-12-12
原生js实现节日时间倒计时功能
本文主要分享了原生js实现节日时间倒计时功能的示例代码。具有一定的参考价值，下面跟着小编一起来看下吧
2017-01-01
JavaScript 鼠标事件(MouseEvent)案例讲解
这篇文章主要介绍了JavaScript 鼠标事件(MouseEvent)案例讲解,本篇文章通过简要的案例,讲解了该项技术的了解与使用,以下就是详细内容,需要的朋友可以参考下
2021-08-08