JavaScript Void 0 – javascript:void(0) là gì?

Posted on by mtoplistChuyên mục:Top List

javascript:void(0) là gì?

Chúng ta bắt gặp lệnh này rất nhiều lần ở href của thẻ <a> mà không biết công dụng của nó là gì 😯.

  
<
a href
=
"javascript:void(0)"
 id
=
"login"
>
login homiedev
.
com
<
/
a
>

Để giải thích javascript:void(0) là gì thì hôm nay, chúng ta sẽ đi tìm hiểu từng phần trong câu lệnh trên để biết ý nghĩa của javascript:void(0) nhé.

void JavaScript là gì?

Từ khóa void trong JavaScript là một operator yêu cầu JavaScript KHÔNG return về kết quả của một biểu thức.

Cùng xem một ví dụ:

let
 total 
=
 
5
 
+
 
5
;

console
.
log
(
total
)
;

Khi chúng ta sử dụng void keyword, biểu thức sẽ return undefined thay vì kết quả là 10.

let
 total 
=
 
void
 
(
5
 
+
 
5
)
;

console
.
log
(
total
)
;

Mặc dù total return undefined, biểu thức 5 + 5 ở trên vẫn được thực thi bởi JavaScript:

let
 total 
=
 
void
 console
.
log
(
5
 
+
 
5
)
;
  
console
.
log
(
total
)
;

Chúng ta có thể thấy, biểu thức theo sau void sẽ vẫn được thực thi như bình thường, nhưng nó sẽ luôn return undefined.

javascript:void(0) là gì?

Như ở giới thiệu đầu bài viết chúng ta thường bắt gặp javascript:void(0) viết dưới dạng giá trị của thuộc tính href cho một số thẻ <a>.

 
<
a href
=
"javascript:void(0)"
 id
=
"show-more"
>

  show more
 
<
/
a
>

Phần javascript: Đây là một URI scheme yêu cầu trình duyệt coi văn bản sau : là mã JavaScript.

Có các URI khác cho thuộc tính href như tel,mailto,…

  mailto
:
homiedev@example
.
com
  └─┬──┘ └────┬─────────────┘
  scheme     path

  tel
:
+
1
-
816
-
555
-
1212

Như ở trên, mình đã giải thích toán tử void JavaScript cho các bạn thì các bạn có thể hiểu được ý nghĩa số 0 bên trong void.

void (* anything *) return undefined. Nó sẽ ngăn chặn hành vi mặc định của thẻ đó, tương tự như khi sử dụng preventDefault trong event onClick.

Chính vì lí do đó nó sẽ làm cho thẻ <a> sẽ không chuyển đến địa chỉ web khác.

Có thể nói javascript:void(0) là cách đơn giản nhất để ngăn chặn hành vi mặc định của thẻ.

Kết luận

Để ngăn chặn hành vi mặc định của thẻ <a>, chúng ta nên sử dụng <button> cho các nút và <a> cho các liên kết.

Khi bạn cần thay đổi con trỏ chuột, bạn nên sử dụng CSS thay vì sử dụng thẻ <a>.

Chúc các bạn học tốt ^^.

Đọc thêm những bài viết hay khác:

mtoplist