JS-06-JS中的void運算子
阿新 • • 發佈：2021-08-04
JS-06-JS中的void運算子
1.void運算子的作用
void運算子是javascript中的一個操作符，語法如下：
-
javascript:void(表示式) -
javascript:void 表示式
運算原理：執行表示式，不返回任何結果。
常用於將一個連結變成死鏈。
2.將一個連結變為死鏈
實現如下要求：
- 1.保留住超連結的樣式
- 2.使用者點選該超連結的時候執行一段JS程式碼
- 3.頁面不能跳轉
2.1實現第一項
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>void運算子</title> </head> <body> 頂頁 <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> <a href="">[--------連結--------]</a> <!-- "" 返回的是一個空字串，href會按當前路徑跳轉 --> </body> </html>
點選連結後，跳轉到開始頁面。
2.2實現第二項
將底部連結標籤中新增一個click事件
<a href="" onclick="alert('Hello World')">[--------連結--------]</a>
點選連結後，執行了一段js程式碼，執行完後跳轉到開始頁面。
2.3實現第三項
在href裡新增javascript:void(0)
<a href="javascript:void(0)" onclick="alert('Hello World')">[--------連結--------]</a>
其中javascript的作用是：告訴瀏覽器後面跟的是一段JS程式碼。
下面程式中javascript是不可省略的，如果不加，void(0)就會被瀏覽器認為是一個相對路徑。
void(表示式)的作用是執行括號裡的表示式，但不返回任何結果。(表示式可以填寫任意數字，不影響。)
如果href後面的雙引號裡什麼都不填，還是會返回一個空字串。就好比在一個函式裡返回""：
<script type="text/javascript">
function doSome() {
return "";
}
alert(doSome());
</script>
執行時還是會返回一個空字串，而只要href後面存在東西，都會按當前路徑去跳轉。
而void(0)連空字串都不會返回。
使用void(0)後，就沒有路徑可以跳轉了，所以頁面不會跳轉。
可見，在點選連結後，執行了一段js程式碼，並且執行完畢後，頁面停留在原位，沒有跳轉。
引用部落格：
https://www.cnblogs.com/chaoguo1234/archive/2013/03/10/2952601.html