javascript:void(0)的含义
<h1>void关键字介绍</h1><p> 首先,void关键字是javascript当中非常重要的关键字,该操作符指定要计算或运行一个表达式,但是不返回值。</p>
<p> 语法格式:</p>
<ol>
<li>void func()</li>
<li>void(func())</li>
</ol>
<h1>实例1</h1>
<p> 当点击超级链接时,什么都不发生</p>
<p> </p>
<div class="cnblogs_code">
<pre><span style="color: rgba(0, 128, 0, 1)"><!--</span><span style="color: rgba(0, 128, 0, 1)"> 1.当用户链接时,void(0)计算为0,用户点击不会发生任何效果 </span><span style="color: rgba(0, 128, 0, 1)">--></span>
<span style="color: rgba(0, 0, 255, 1)"><</span><span style="color: rgba(128, 0, 0, 1)">a </span><span style="color: rgba(255, 0, 0, 1)">href</span><span style="color: rgba(0, 0, 255, 1)">="javascript:void(0);"</span><span style="color: rgba(0, 0, 255, 1)">></span>单击此处什么都不会发生<span style="color: rgba(0, 0, 255, 1)"></</span><span style="color: rgba(128, 0, 0, 1)">a</span><span style="color: rgba(0, 0, 255, 1)">><</span><span style="color: rgba(128, 0, 0, 1)">br</span><span style="color: rgba(0, 0, 255, 1)">></span></pre>
</div>
<h1>实例2</h1>
<p> 执行void操作符当中的代码</p>
<div class="cnblogs_code">
<pre><span style="color: rgba(0, 128, 0, 1)"><!--</span><span style="color: rgba(0, 128, 0, 1)"> 2.执行 void() 操作符中的代码 </span><span style="color: rgba(0, 128, 0, 1)">--></span>
<span style="color: rgba(0, 0, 255, 1)"><</span><span style="color: rgba(128, 0, 0, 1)">a </span><span style="color: rgba(255, 0, 0, 1)">href</span><span style="color: rgba(0, 0, 255, 1)">="javascript:void(alert('还真点啊你,真听话!!!哈哈哈!!!'))"</span><span style="color: rgba(0, 0, 255, 1)">></span>点我弹出警告框!!!<span style="color: rgba(0, 0, 255, 1)"></</span><span style="color: rgba(128, 0, 0, 1)">a</span><span style="color: rgba(0, 0, 255, 1)">><</span><span style="color: rgba(128, 0, 0, 1)">br</span><span style="color: rgba(0, 0, 255, 1)">></span>
<span style="color: rgba(0, 0, 255, 1)"><</span><span style="color: rgba(128, 0, 0, 1)">a </span><span style="color: rgba(255, 0, 0, 1)">href</span><span style="color: rgba(0, 0, 255, 1)">="javascript:void(console.log('还真点啊你,真听话!!!哈哈哈!!!'))"</span><span style="color: rgba(0, 0, 255, 1)">></span>点我输出到控制台!!!<span style="color: rgba(0, 0, 255, 1)"></</span><span style="color: rgba(128, 0, 0, 1)">a</span><span style="color: rgba(0, 0, 255, 1)">><</span><span style="color: rgba(128, 0, 0, 1)">br</span><span style="color: rgba(0, 0, 255, 1)">></span></pre>
</div>
<h1>实例3</h1>
<p> 计算void操作符当中的算术</p>
<p>html:</p>
<div class="cnblogs_code">
<pre><span style="color: rgba(0, 0, 255, 1)"><</span><span style="color: rgba(128, 0, 0, 1)">button </span><span style="color: rgba(255, 0, 0, 1)">type</span><span style="color: rgba(0, 0, 255, 1)">="button"</span><span style="color: rgba(0, 0, 255, 1)">></span>点我<span style="color: rgba(0, 0, 255, 1)"></</span><span style="color: rgba(128, 0, 0, 1)">button</span><span style="color: rgba(0, 0, 255, 1)">></span></pre>
</div>
<p>js:</p>
<div class="cnblogs_code">
<pre><script type="text/javascript"><span style="color: rgba(0, 0, 0, 1)">
document.querySelector(</span>'button').addEventListener('click', <span style="color: rgba(0, 0, 255, 1)">function</span><span style="color: rgba(0, 0, 0, 1)"> () {
</span><span style="color: rgba(0, 0, 255, 1)">var</span><span style="color: rgba(0, 0, 0, 1)"> a, b, c, d;
a </span>= <span style="color: rgba(0, 0, 255, 1)">void</span>(b = 2, c = 3<span style="color: rgba(0, 0, 0, 1)">);
console.log(</span>'a => ' +<span style="color: rgba(0, 0, 0, 1)"> a);
console.log(</span>'b => ' +<span style="color: rgba(0, 0, 0, 1)"> b);
console.log(</span>'c => ' +<span style="color: rgba(0, 0, 0, 1)"> c);
console.log(</span>'d => ' +<span style="color: rgba(0, 0, 0, 1)"> d);
});
</span></script></pre>
</div>
<p>控制台输出:</p>
<p><img src="https://img2018.cnblogs.com/blog/1673644/201906/1673644-20190628204619361-499812618.png"></p>
<p>很显然,2赋值给了a, 3赋值给了b, a 和 d一样只是定义了没有赋值,所以为 undefined</p>
<h1># 与 javascript:void(0)的区别:</h1>
<ul>
<li>#可以跳转到设置了id的目的地</li>
<li>javascript:void(0)则停留在原地,一动不动,我们称之为“死链接”</li>
</ul>
<p>如下面这个例子:</p>
<div class="cnblogs_code">
<pre><a href="javascript:void(0);">你点吧,反正我就是不动,嘿嘿嘿!!!</a><br>
<a href="#destination">点我跳转</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></pre>
</div>
<ul>
<li>当点击第一个链接时,一动不动</li>
<li>当点击第二个连接时,会跳转到指定id得位置(页面最底部)</li>
</ul><br><br>
来源:https://www.cnblogs.com/duxiu-fang/p/11104735.html
頁:
[1]