Apa artinya "javascript: void (0)"?

<a href="javascript:void(0)" id="loginlink">login</a>

Saya telah melihat hrefitu berkali-kali, tetapi saya tidak tahu apa artinya itu.

The voidOperator mengevaluasi ekspresi yang diberikan dan kembali kemudian undefined.

The voidOperator sering digunakan semata-mata untuk mendapatkan undefinednilai primitif, biasanya menggunakan “ void(0)” (yang setara dengan “ void 0”). Dalam kasus ini, variabel global undefined dapat digunakan sebagai gantinya (dengan asumsi itu belum ditetapkan ke nilai non-default).

Penjelasan diberikan di sini: voidoperator .

Alasan Anda ingin melakukan ini dengan hreftautan adalah karena biasanya, javascript:URL akan mengarahkan ulang browser ke versi teks biasa dari hasil mengevaluasi JavaScript itu. Tetapi jika hasilnya undefined, maka browser tetap berada pada halaman yang sama. void(0)hanyalah skrip pendek dan sederhana yang dievaluasi untuk undefined.

Selain jawaban teknis, javascript:voidberarti penulis melakukan Doing It Wrong.

Tidak ada alasan bagus untuk menggunakan javascript:pseudo-URL (*). Dalam praktiknya itu akan menyebabkan kebingungan atau kesalahan jika ada orang yang mencoba hal-hal seperti 'tautan bookmark', 'tautan terbuka di tab baru', dan sebagainya. Ini terjadi cukup banyak sekarang orang sudah terbiasa dengan klik-tengah-untuk-tab baru: sepertinya sebuah tautan, Anda ingin membacanya di tab baru, tetapi ternyata itu bukan tautan yang sebenarnya sama sekali, dan memberikan hasil yang tidak diinginkan seperti halaman kosong atau kesalahan JS ketika diklik tengah.

<a href="#">adalah alternatif umum yang bisa dibilang tidak terlalu buruk. Namun Anda harus ingat return falsedari onclickpengendali acara Anda untuk mencegah tautan diikuti dan menggulir ke atas halaman.

Dalam beberapa kasus mungkin ada tempat berguna sebenarnya untuk mengarahkan tautan. Sebagai contoh jika Anda memiliki kontrol Anda dapat mengklik yang membuka yang sebelumnya disembunyikan <div id="foo">, masuk akal untuk digunakan <a href="#foo">untuk menautkannya. Atau jika ada cara non-JavaScript untuk melakukan hal yang sama (misalnya, 'thispage.php? Show = foo' yang membuat foo terlihat sebagai awal), Anda dapat menautkannya.

Kalau tidak, jika sebuah tautan hanya menunjuk ke beberapa skrip, itu sebenarnya bukan tautan dan tidak boleh ditandai seperti itu. Pendekatan yang biasa akan menambahkan onclickke <span>, <div>, atau <a>tanpa hrefdan gaya dalam beberapa cara untuk membuatnya jelas Anda dapat klik di atasnya. Inilah yang StackOverflow [lakukan pada saat penulisan; sekarang menggunakan href="#"].

Kerugian dari ini adalah Anda kehilangan kontrol keyboard, karena Anda tidak dapat menabrak span / div / bare-a atau mengaktifkannya dengan ruang. Apakah ini sebenarnya merupakan kerugian tergantung pada jenis tindakan yang ingin dilakukan oleh elemen tersebut. Anda dapat, dengan susah payah, berusaha untuk meniru kemampuan keyboard dengan menambahkan tabIndexelemen, dan mendengarkan penekanan tombol Space. Tapi itu tidak akan 100% mereproduksi perilaku browser yang sebenarnya, paling tidak karena browser yang berbeda dapat merespons keyboard secara berbeda (belum lagi browser non-visual).

Jika Anda benar-benar menginginkan elemen yang bukan tautan tetapi yang dapat diaktifkan seperti biasa dengan mouse atau keyboard, yang Anda inginkan adalah <button type="button">(atau <input type="button">sama baiknya, untuk konten teks sederhana). Anda selalu dapat menggunakan CSS untuk menata ulangnya agar terlihat lebih seperti tautan daripada tombol, jika Anda mau. Tapi karena itu berperilaku seperti tombol, itu adalah bagaimana Anda benar-benar harus menandainya.

(*: dalam pembuatan situs, bagaimanapun. Jelas mereka berguna untuk bookmarklet. javascript:pseudo-URL adalah keanehan konseptual: pelacak yang tidak menunjuk ke suatu lokasi, tetapi sebaliknya memanggil kode aktif di dalam lokasi saat ini. Mereka telah menyebabkan keamanan besar-besaran masalah untuk browser dan aplikasi web, dan seharusnya tidak pernah ditemukan oleh Netscape.)

Itu berarti tidak akan melakukan apa-apa. Ini merupakan upaya untuk membuat tautan tidak 'bernavigasi' di mana pun. Tapi itu bukan cara yang benar.

Anda harus benar-benar hanya return falsedi onclickacara tersebut, seperti:

<a href="#" onclick="return false;">hello</a>

Biasanya ini digunakan jika tautannya melakukan hal 'JavaScript-y'. Seperti memposting formulir AJAX, atau menukar gambar, atau apa pun. Dalam hal ini Anda hanya membuat fungsi apa pun yang disebut return false.

Namun, untuk membuat situs web Anda benar-benar luar biasa, Anda akan menyertakan tautan yang melakukan tindakan yang sama, jika orang yang menjelajahinya memilih untuk tidak menjalankan JavaScript.

<a href="backup_page_displaying_image.aspx"
   onclick="return coolImageDisplayFunction();">hello</a>

Ada perbedaan besar dalam perilaku "#" vs javascript: void

"#" menggulir Anda ke TOP halaman sementara "javascript: void (0);" tidak.

Ini sangat penting jika Anda mengkode halaman dinamis. pengguna tidak ingin kembali ke atas hanya karena dia mengklik tautan pada halaman tersebut.

Ini adalah metode yang sangat populer untuk menambahkan fungsi JavaScript ke tautan HTML.
Misalnya: [Print]tautan yang Anda lihat di banyak laman web ditulis seperti ini:

<a href="javascript:void(0)" onclick="callPrintFunction()">Print</a>

Mengapa kita perlu hrefsementara onclicksendirian bisa menyelesaikan pekerjaan? Karena ketika pengguna mengarahkan kursor ke teks 'Cetak' ketika tidak ada href, kursor akan berubah menjadi tanda sisipan (ꕯ) alih-alih sebuah penunjuk (👆). Hanya memiliki hrefpada atag memvalidasi sebagai hyperlink.

Alternatif untuk href="javascript:void(0);", adalah penggunaan href="#". Alternatif ini tidak memerlukan JavaScript untuk diaktifkan di browser pengguna, sehingga lebih kompatibel.

Anda harus selalu memiliki href pada Anda sebuah tag. Memanggil fungsi JavaScript yang mengembalikan 'tidak terdefinisi' akan baik-baik saja. Jadi akan ditautkan ke '#'.

Tag anchor di Internet Explorer 6 tanpa href jangan a:hovermenerapkan gaya.

Ya, ini mengerikan dan merupakan kejahatan kecil terhadap kemanusiaan, tetapi sekali lagi Internet Explorer 6 secara umum.

Saya harap ini membantu.

Internet Explorer 6 sebenarnya merupakan kejahatan besar terhadap kemanusiaan.

Perlu disebutkan bahwa Anda kadang-kadang akan melihat void 0 ketika memeriksa undefined, hanya karena membutuhkan lebih sedikit karakter.

Sebagai contoh:

something === undefined

vs.

something === void 0

Beberapa metode minifikasi menggantikan undefined dengan void 0 karena alasan ini.

Penggunaan javascript:void(0)berarti bahwa pembuat HTML menyalahgunakan elemen anchor sebagai ganti elemen tombol.

Tag jangkar sering disalahgunakan dengan acara onclick untuk membuat tombol pseudo dengan mengatur href ke "#" atau "javascript: void (0)" untuk mencegah halaman dari penyegaran. Nilai-nilai ini menyebabkan perilaku yang tidak terduga saat menyalin / menarik tautan, membuka tautan di tab / jendela baru, membookmark, dan ketika JavaScript masih mengunduh, kesalahan keluar, atau dinonaktifkan. Ini juga menyampaikan semantik yang salah untuk teknologi bantu (misalnya, pembaca layar). Dalam kasus ini, disarankan untuk menggunakan <button>. Secara umum, Anda hanya harus menggunakan jangkar untuk navigasi menggunakan URL yang tepat.

Sumber: Halaman MDN<a> .

void adalah operator yang digunakan untuk mengembalikan a undefined nilai sehingga browser tidak akan dapat memuat halaman baru.

Browser web akan mencoba dan mengambil apa pun yang digunakan sebagai URL dan memuatnya kecuali itu adalah fungsi JavaScript yang mengembalikan nol. Misalnya, jika kita mengklik tautan seperti ini:

<a href="javascript: alert('Hello World')">Click Me</a>

maka pesan peringatan akan muncul tanpa memuat halaman baru, dan itu karena alert adalah fungsi yang mengembalikan nilai nol. Ini berarti bahwa ketika browser mencoba memuat halaman baru, halaman itu terlihat nol dan tidak ada yang dimuat.

Satu hal penting yang perlu diperhatikan tentang operator batal adalah ia membutuhkan nilai dan tidak dapat digunakan dengan sendirinya. Kita harus menggunakannya seperti ini:

<a href="javascript: void(0)">I am a useless link</a>

Untuk memahami konsep ini kita harus terlebih dahulu memahami operator batal dalam JavaScript.

Sintaks untuk operator void adalah: void «expr» yang mengevaluasi expr dan mengembalikan yang tidak ditentukan.

Jika Anda menerapkan void sebagai suatu fungsi, tampilannya sebagai berikut:

function myVoid(expr) {
    return undefined;
}

Operator batal ini memiliki satu penggunaan penting yaitu - membuang hasil ekspresi.

Dalam beberapa situasi, penting untuk mengembalikan yang tidak terdefinisi sebagai lawan dari hasil ekspresi. Maka void dapat digunakan untuk membuang hasil itu. Salah satu situasi seperti itu melibatkan javascript: URL, yang harus dihindari untuk tautan, tetapi berguna untuk bookmarklet. Ketika Anda mengunjungi salah satu URL itu, banyak browser mengganti dokumen saat ini dengan hasil mengevaluasi URL "konten", tetapi hanya jika hasilnya tidak ditentukan. Karenanya, jika Anda ingin membuka jendela baru tanpa mengubah konten yang sedang ditampilkan, Anda dapat melakukan hal berikut:

javascript:void window.open("http://example.com/")

The voidOperator mengevaluasi ekspresi yang diberikan dan kemudian mengembalikan terdefinisi. Itu menghindari menyegarkan halaman.

Pengembang Web menggunakan javascript:void(0)karena ini adalah cara termudah untuk mencegah perilaku default atag. void(*anything*)kembali undefineddan itu adalah nilai yang salah. dan mengembalikan nilai falsy seperti return falsedi onclickacara atag yang mencegah perilaku default.

Jadi saya pikir javascript:void(0)adalah cara paling sederhana untuk mencegah perilaku default dari atag.

Tautan harus memiliki target HREF yang ditentukan untuk memungkinkannya menjadi objek tampilan yang dapat digunakan.

Sebagian besar browser tidak akan melewatkan JavaScript tingkat lanjut dalam

<A HREF="" 

tag seperti:

<A href="JavaScript:var elem = document.getElementById('foo');" 

karena tag HREF di sebagian besar browser tidak memungkinkan spasi putih, atau akan mengonversi spasi putih menjadi% 20, HEX sama dengan SPACE, yang menjadikan JavaScript Anda sama sekali tidak berguna untuk penerjemah.

Jadi jika Anda ingin menggunakan tag A HREF untuk mengeksekusi JavaScript inline, Anda harus menentukan nilai yang valid untuk HREF FIRST yang tidak terlalu rumit (tidak mengandung spasi), dan kemudian menyediakan JavaScript dalam tag atribut acara seperti OnClick , OnMouseOver, OnMouseOut, dll.

Jawaban khasnya adalah melakukan sesuatu seperti ini:

<A HREF="#" onclick="var elem = document.getElementById('foo');">Get the object</a>

Ini berfungsi dengan baik tetapi itu membuat halaman melompat ke atas karena tanda pound / tag hash menyuruhnya melakukannya.

Hanya dengan memberikan tanda pound / tanda pagar dalam tag A HREF sebenarnya menentukan jangkar root, yang selalu, secara default bagian atas halaman, Anda dapat menentukan lokasi yang berbeda dengan menggunakan menentukan atribut NAME di dalam tag A HREF.

<A NAME='middleofpage'></A>

Anda kemudian dapat mengubah tag A HREF Anda untuk melompat ke 'middleofpage' dan menjalankan JavaScript di acara OnClick, setelah itu terjadi seperti ini:

<A HREF="#middleofpage" onclick="var elem = document.getElementById('foo');">Get the object</a>

Akan ada waktu BANYAK di mana Anda tidak ingin tautan itu melompat, sehingga Anda dapat melakukan dua hal:

<A HREF="#thislinkname" name='thislinkname' onclick="var elem = document.getElementById('foo');">Get the object</a>

Sekarang itu tidak akan kemana-mana ketika diklik, tetapi itu dapat menyebabkan halaman untuk kembali pusat dari viewport saat ini. Ini tidak cantik. Apa cara terbaik untuk menyediakan javascript in-line, menggunakan A HREF, tetapi tanpa harus melakukan hal di atas? JavaScript: void (0);

<A HREF="JavaScript:void(0);" onclick="var elem = document.getElementById('foo');">Get the object</a>

Ini memberi tahu peramban untuk pergi SEKARANG, tetapi sebaliknya menjalankan JavaScript yang valid: void (0); berfungsi pertama di tag HREF karena tidak mengandung spasi, dan tidak akan diuraikan sebagai URL. Alih-alih itu akan dijalankan oleh kompiler. VOID adalah kata kunci yang, ketika diberikan dengan perameter dari 0 pengembalian TIDAK DILAKUKAN, yang tidak menggunakan sumber daya lagi untuk menangani nilai kembali yang akan terjadi tanpa menentukan 0 (itu lebih manajemen memori / ramah kinerja).

Hal berikutnya yang terjadi adalah OnClick dijalankan. Halaman tidak bergerak, tidak ada yang terjadi dengan tampilan.

JavaScript: samping URL; Di sinilah void dapat berguna untuk menulis kode yang lebih pendek.

var error1 = false,
    error2 = false,
    error3 = false;

function error1() {

  error1 = true;
}

function myFunction() {

  // You can easily return and call a function at once, if you don't care about myFunction's return value
  if (!someCondition1)
    return error1();

  // What if you want to set a value first?
  if (!someCondition2) {
    error2 = true;
    return
  }

  // Shortest way to return and set a value at once
  if (!someCondition3)
    return void(error3 = true);

  // More code goes here
}