JavaScript 阻止超連結跳轉的操作方法(多種寫法)
阿新 • • 發佈：2021-06-21
通過javascript，我們可以阻止超連結的跳轉。
方法如下：
（1）操作超連結的 href 屬性
寫法一：
<!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>Document</title>
</head>
<body>
<a href="
寫法二：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible"http://www.cppcns.com content="IE=edge">
<meta name="viewport" content="width=device-width,initial-scale=1.0">
<title>Document</title>
</head>
<body>
<a href="javascript:;" rel="external nofollow" >超連結</a>
</body>
</html>
點選連結OeFnCjg，連結並不會進行跳轉。
（2）阻止連結的預設行為
寫法一：
<!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>Document</title>
</head>
<body>
<a href="https://www.baidu.com" rel="external nofollow" rel="external nofollow" >百度</a>
<script>
var link = document.querySelector("a");
link.addEventListener('click',function(e){
e.preventDefault();
})
</script>
</body>
</html>寫法二：
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" cohttp://www.cppcns.comntent="width=device-width,initial-scale=1.0"> <title>Document</title> </head> <body> <a href="https://www.baidu.com" rel="external nofollow程式設計客棧" rel="external nofollo程式設計客棧w" >百度</a> <script> var link = document.querySelector("a"); link.onclick = function (e) { return false; } </script> </body> </html>
此時，點選超連結，也不會進行跳轉。
以上就是JavaScript 阻止超連結跳轉的操作方法(多種寫法)的詳細內容，更多關於js超連結跳轉的資料請關注我們其它相關文章！