<a href=tıkjavascript:; çözümleri> </a> ne ifade eder?

Web sayfalarında zaman zaman aşağıdaki hreflerin kullanıldığını gördüm. Ancak, bunun ne yapmaya çalıştığını veya tekniği anlayamıyorum. Birisi lütfen ayrıntılandırabilir mi?

<a href="javascript:;"></a>

Bir <a>öğe, hrefveya nameözniteliği olmadığı sürece geçersiz HTML'dir.

Bir bağlantı olarak doğru şekilde görüntülenmesini istiyorsanız (yani altı çizili, el işaretçisi vb.), Yalnızca bir hrefözniteliği varsa bunu yapar .

Bu nedenle böyle bir kod bazen bağlantı kurmanın bir yolu olarak kullanılır, ancak hrefözellikte gerçek bir URL sağlamak zorunda kalmaz . Geliştirici, bağlantının kendisinin hiçbir şey yapmamasını istiyordu ve bu onun en kolay yoluydu.

Muhtemelen başka bir yerde link tıklandığında tetiklenen bazı javascript olay kodu vardır ve bu gerçekten olmasını istediği şey olacaktır, ancak normal bir <a>etiket bağlantısı gibi görünmesini ister .

Bazı geliştiriciler href='#'aynı amaç için kullanırlar , ancak bu, tarayıcının sayfanın en üstüne gitmesine neden olur ve bu da istenmeyebilir. Ve href'i boş bırakamazdı, çünkü href=''mevcut sayfaya bir bağlantı (yani bir sayfanın yenilenmesine neden oluyor).

Bu şeylerin etrafında yollar var. hrefİçinde Javascript kodu boş bir bit kullanmak bunlardan biridir ve en iyi çözüm olmasa da işe yarar.

temel olarak sayfaları taşımak için bağlantı kullanmak yerine (veya bağlantılarını), bu yöntemi kullanmak bir javascript işlev (ler) i başlatır

<script>
function doSomething() {
  alert("hello")
}
</script>
<a href="javascript:doSomething();">click me</a>

linke tıklamak uyarıyı tetikler.

Bir bağlantının hedefine ulaşmasını önlemek için çeşitli mekanizmalar vardır. Bu sorudan çok sezgisel değil.

Daha temiz bir seçenek, belgedeki tanımlı olmayan bir tutturucunun href="#no"nerede #noolduğunu kullanmaktır .

Okunabilirliği artırmak için #disable veya #action gibi daha semantik bir ad kullanabilirsiniz.

Yaklaşımın faydaları:

• Boş href = "#" öğesinin "yukarı taşınması" etkisinden kaçınır
• Javascript kullanımını önler

Dezavantajları:

• Bağlantı adının belgede kullanılmadığından emin olmalısınız.

Yana <a>eleman bir bağlantı olarak hareket etmediğini, bu gibi durumlarda en iyi seçenek bir kullanmıyor <a>elemanı ancak <div>ve istenen bağlantıyı benzeri tarzda sağlarlar.

<a href="javascript:alert('Hello');"></a>

sadece kısaltmasıdır:

<a href="" onclick="alert('Hello'); return false;"></a>

Bu, bir bağlantı tıklandığında kesinlikle bir şey yapmanın bir yoludur (Javascript olayları buna bağlı olmadıkça).

Bir bağlantıyı takip etmek yerine Javascript çalıştırmanın bir yoludur:

<a href="Javascript: doStuff();">link</a>

Çalıştırılacak gerçekte javascript yoksa (örneğiniz gibi) hiçbir şey yapmaz.

Şuna bakın:

<a href="Http://WWW.stackoverflow.com">Link to the website opened in different tab</a>
<a href="#MyDive">Link to the div in the page(look at the chaneged url)</a>
<a href="javascript:;">Nothing happens if there is no javaScript to render</a>

<a href="javascript:void(0);"></a>

javascript: tarayıcıya javascript kodu yazacağını söyler

Eski iş parçacığı ama sadece geliştiricilerin bu yapıyı kullanmasının nedeninin ölü bir bağlantı oluşturmak olmadığını, ancak javascript URL'lerinin herhangi bir nedenle etkin html öğesine referansları doğru bir şekilde iletmediğini düşündüğümü düşündüm.

ör . javascript URL'si olarak handler_function(this.id)çalışır, onClickancak javascript URL'si olarak çalışmaz.

Bu nedenle, her köprü için çağrıyı manuel olarak ayarlamak zorunda kalmanızı sağlayan, bilgili standartlara uygun kod yazma veya bir kez yazılabilen ve her yerde kullanılabilen standart olmayan bir kod yazma arasında bir seçimdir.

Bu yüzden etiketleri html için geçerli hale getirmek için bağlantılardan kaçınmak hrefyerine olay dinleyicileri yerine js kodları yazmak için kullanılır .onclick#hrefa

Özelliğin javascript:içinde nasıl kullanılacağına dair bir araştırma yaptım href.

<a href="
     javascript:
        a = 4;
        console.log(a++); 
        a += 2; 
        console.log(a++); 
        if(a < 6){ 
            console.log('a is lower than 6');
        } 
        else 
            console.log('a is greater than 6');
        function log(s){
            console.log(s);
        }
        log('function inplimentation working too');

">Click here</a>

Bu kod sayesinde, yalnızca arama işlevleri yerine js kodları yazabilirsiniz.

68.0.3440.106 krom Sürümünde test edildi (Resmi Derleme) (64 bit)

Firefox Quantom 61.0.1 (64 bit) içinde test edilmiştir

Her zaman düzgün bir bağlantı oluşturmak için en iyi yolu css aşağıdaki gibidir:

a {cursor: pointer !important}

İplikte bahsedildiği gibi gereksiz şeyleri takip etmekten kaçınılmalıdır.