Pautan Bersarang dalam HTML: Dibenarkan atau Tidak?

Pautan Bersarang: Dibenarkan atau Dilarang?

Dalam pembangunan web, persoalan biasa timbul: adakah dibenarkan untuk meletakkan pautan dalam pautan lain ?

W3C HTML4 Stance

Menurut garis panduan HTML4 W3C, pautan bersarang adalah dilarang. Elemen A tidak boleh mengandungi unsur A lain.

Perspektif HTML5

Dalam HTML5, peraturan telah berkembang sedikit. Walaupun pautan bersarang masih tidak dibenarkan, terdapat kekangan baharu: kandungan interaktif, yang termasuk tag sauh (elemen A), tidak boleh diletakkan di dalam elemen A.

Amalan Terbaik

Walaupun sekatan ini, reka letak tertentu mungkin memerlukan kawasan boleh klik yang merangkumi berbilang boleh klik elemen.

Pendekatan Alternatif

• Menggunakan CSS: Tetapkan kawasan boleh klik kepada elemen induk dan gunakan CSS untuk menggayakan pautan yang sesuai tingkah laku.
• Menggunakan JavaScript: Gunakan pengendali acara untuk menangkap klik dan menentukan tindakan yang dimaksudkan berdasarkan elemen sasaran.

Contoh

Pertimbangkan coretan kod yang diberikan:

<a href="#" class="sp_mngt_bar">
    <h1><?php echo $v; ?></h1>
    <a href="#" class="t_icons t_icons_settings sp_mngt_settings"></a>
    <a href="#" class="t_icons t_icons_move sp_mngt_move"></a>
</a>

Untuk menjadikan keseluruhan kelabu bar boleh diklik, anda boleh menetapkan pengendali acara klik kepada induk elemen dan gunakan jQuery seperti berikut:

$('.sp_mngt_bar').click(function(e) {
  if (e.target.className.indexOf('sp_mngt_move') > -1) {
    // Handle move icon click
  } else if (e.target.className.indexOf('sp_mngt_settings') > -1) {
    // Handle settings icon click
  } else {
    // Handle main link click
  }
});