JQuery ve $ işareti

Giriş
1.JQuery ile kullanılan $ işareti document.getElementById() ile aynı anlama geliyor. Bu konuyu From jquery back to JavaScript sorusunda görmek mümkün.

document.getElementById('some_button') fonksiyonu bir HtmlElement döndürür.

2. $(".XYZ") şeklinde başlayanlar ise class="XYZ" olan elemetlere uygulanır.

3. $(this) Event handler içinde kullanılır. Hangi nesne event kaynağı ise onu temsil eder.

Örnek - Class
Elimizde şöyle bir html olsun.

<img class="switch" data-switchid="1" src="https://via.placeholder.com/150">

Class değeri switch olan nesnelere şöyle yaparız

$(document).on('click','.switch',function(){
    console.log($(this).data("switchid"));
});

Aynı şeyi JQuery olmadan şöyle yaparız

document.querySelector(".switch").onclick = function(){
  console.log(this.getAttribute("data-switchid"));
}

Örnek - Class

Şöyle yaparız. Burada class değeri olarak restaurantName ve link kısmında çiğ köfte geçen nesneler parent nesneden siliniyor.

$(document).ready(function(){
  $(".restaurantName[href*='cig-kofte'], .restaurantName[href*='cigkofte']")
    .parents(".ys-item").remove();
});

Örnek - Html Tag
Şöyle yaparız

jQuery($ => {
  $('td').on('click', function() {
    console.log(this);
  })
});

Örnek - $(this)
Eğer $(this) asenkron olarak kullanılacaksa onu bir değişkende saklamak gerekir. Şöyle yaparız.

$("#table_tbody").on("click", ".remove-category", function(e){
    e.preventDefault();
    var $this = $(this); // save $(this)
    let entryId = $this.data("id"); //use $this here
    $.ajax({
        url : controller_url + '/remove_category/' + entryId,
        type: "GET",
        dataType: "JSON"
    }).done(function(response){
        if(response.status) {
            $this.parents("tr").remove(); // use $this here (again)    
        }
    });
});