Bu kötü bir uygulama olduğunu biliyorum. Eğer mümkünse böyle bir kod yazmak yok.

Tabii ki, her zaman satır içi Javascript zeki bir parçasında bir sorun hızlı bir şekilde ele alabilir durumlarda kendimizi buluruz.

Böyle bir şey yazıldığında ne olacağını tam olarak anlamak ilgi (ve potansiyel tuzaklar) bu sorgu takip ediyorum:

<a href="#" onclick="alert('Hi')">Click Me</a>

Söyleyebileceğim kadarıyla, bu aynı işlevsel

<script type="text/javascript">
   $(function(){ // I use jQuery in this example
       document.getElementById('click_me').onclick = 
           function () { alert('Hi'); };
   });
</script>
<a href="#" id="click_me">Click Me</a>

Dize onclick öznitelik atanmış elemanın tıklayın memura havale olan isimsiz bir işlev içinde eklenen bu ondan da hesaba katarsak görünüyor. Bu gerçekten böyle mi?

Yapmaya başlıyorum çünkü böyle şeyler:

<a href="#" onclick="$(this).next().fadeIn(); return false;">Display my next sibling</a> <!-- Return false in handler so as not to scroll to top of page! --> 

Çalışır. Ama bu hack nasıl bilmiyorum. Gelen döndürülen belirgin işlevi yoktur, çünkü şüpheli görünüyor!

Bunu neden yapıyorsun diye sorabilirsiniz, Steve? Inline JS kötü bir uygulama!

Aslında oldukça dürüst olmak için kod üç farklı bölümden sadece özellikle sadece eğer işe yarayacaktır görmek için bir prototip olduğumda bir sayfanın bir bölümünü değiştirmek için düzenleme bıktım. Çok daha kolay ve hatta bazen kodu tanımlanacak bu HTML öğesi için özel olarak ilgili mantıklısağ içindeeleman: ben karar veririm 2 dakika sonra bu oldu korkunç bir fikir verebilirim nuke tüm dıv (ya da her neyse) ve ben de değil, bir sürü gizemli JS ve CSS işe yaramayan öğeleri etrafında asılı kalan sayfa, yavaşlama işleme hiç bu kadar biraz. Bu referans yerellik kavramına benzer ama önbellek hataları ve kod kabartmak bakıyoruz özlüyor yerine.

Neredeyse doğru var, ama this değeri satır kod için sağlanan sini vermedin.

<a href="#" onclick="alert(this)">Click Me</a>

aslında daha yakın

<a href="#" id="click_me">Click Me</a>
<script type="text/javascript">
document.getElementById('click_me').addEventListener("click", function(event) {
    (function(event) {
        alert(this);
    }).call(document.getElementById('click_me'), event);
});
</script>

Satır içi olay işleyicileri olay hedefi eşit this ayarlayın.