jQuery - jQuery

jQuery

Orijinal yazar(lar)	John Resig
Geliştirici(ler)	jQuery Ekibi
İlk sürüm	26 Ağustos 2006 ; 15 yıl önce ( 2006-08-26 )
kararlı sürüm	3.6.0 / (2 Mart 2021 ; 7 ay önce ) ( 2021-03-02 )
depo
Yazılmış	JavaScript
platformu	§ Tarayıcı desteğine bakın
Boy	27–274 KB
Tip	JavaScript kitaplığı
Lisans	MİT
İnternet sitesi	jquery .com

jQuery , HTML DOM ağaç geçişi ve manipülasyonunun yanı sıra olay işleme , CSS animasyonu ve Ajax'ı basitleştirmek için tasarlanmış bir JavaScript kitaplığıdır . Öyle ücretsiz, açık kaynak yazılım müsamahakâr kullanarak MİT Lisansı . Mayıs 2019 itibarıyla jQuery, en popüler 10 milyon web sitesinin %73'ü tarafından kullanılmaktadır. Web analizi, diğer JavaScript kitaplıklarından en az 3 ila 4 kat daha fazla kullanıma sahip olan, büyük bir farkla en yaygın olarak kullanılan JavaScript kitaplığı olduğunu gösterir.

jQuery'nin sözdizimi, bir belgede gezinmeyi, DOM öğelerini seçmeyi , animasyonlar oluşturmayı , olayları işlemeyi ve Ajax uygulamaları geliştirmeyi kolaylaştırmak için tasarlanmıştır . jQuery, geliştiricilere JavaScript kitaplığının üstünde eklentiler oluşturma yetenekleri de sağlar . Bu, geliştiricilerin düşük seviyeli etkileşim ve animasyon, gelişmiş efektler ve üst seviye, temaya uygun widget'lar için soyutlamalar oluşturmasını sağlar . jQuery kitaplığına modüler yaklaşım, güçlü dinamik web sayfalarının ve Web uygulamalarının oluşturulmasına olanak tanır .

Grubu jQuery çekirdek özellikleri -DOM eleman seçimleri, geçişi ve manipülasyon özellikli onun tarafından seçici motoru yeni bir "programlama stili" oluşturdu (v1.3 itibaren "Sizzle" adında), eritme algoritmalar ve DOM veri yapılarını. Bu stil, YUI v3 ve Dojo gibi diğer JavaScript çerçevelerinin mimarisini etkiledi ve daha sonra standart Selectors API'sinin oluşturulmasını teşvik etti . Daha sonra, bu stil, D3.js çerçevesi olan jQuery'nin bir varisi içinde daha derin bir algoritma-veri birleştirme ile geliştirildi .

Microsoft ve Nokia, jQuery'yi platformlarında paketler. Microsoft, Microsoft'un ASP.NET AJAX ve ASP.NET MVC çerçevelerinde kullanım için Visual Studio'ya dahil ederken, Nokia bunu Web Run-Time widget geliştirme platformuna entegre etti.

genel bakış

jQuery, özünde bir Belge Nesne Modeli (DOM) işleme kitaplığıdır. DOM, bir Web sayfasının tüm öğelerinin bir ağaç yapısı temsilidir. jQuery, bu DOM öğelerini bulma, seçme ve değiştirme sözdizimini basitleştirir. Örneğin, jQuery, belgede belirli bir özelliğe sahip bir öğeyi bulmak (örn. h1 etiketine sahip tüm öğeler ), bir veya daha fazla niteliğini değiştirmek (örn. renk, görünürlük) veya bir olaya yanıt vermek için kullanılabilir ( örneğin bir fare tıklaması).

jQuery ayrıca, temel DOM öğesi seçimi ve manipülasyonunun ötesine geçen olay işleme için bir paradigma sağlar. Olay ataması ve olay geri çağırma işlevi tanımı, kodda tek bir yerde tek bir adımda yapılır. jQuery ayrıca, çok kullanılan diğer JavaScript işlevlerini (örneğin, öğeleri gizlerken solma ve solma, CSS özelliklerini manipüle ederek animasyonlar ) dahil etmeyi amaçlar .

jQuery ile geliştirme ilkeleri şunlardır:

• JavaScript ve HTML'nin ayrılması: jQuery kitaplığı, JavaScript işlevlerini çağırmak için HTML olay öznitelikleri eklemek yerine JavaScript kullanarak DOM'a olay işleyicileri eklemek için basit sözdizimi sağlar . Bu nedenle, geliştiricileri JavaScript kodunu HTML işaretlemesinden tamamen ayırmaya teşvik eder .
• Kısalık ve netlik: jQuery, "zincirlenebilir" işlevler ve kısayol işlev adları gibi özelliklerle kısalık ve netliği destekler.
• Tarayıcılar arası uyumsuzlukların ortadan kaldırılması: Farklı tarayıcıların JavaScript motorları biraz farklıdır, bu nedenle bir tarayıcıda çalışan JavaScript kodu başka bir tarayıcıda çalışmayabilir. Diğer JavaScript araç takımları gibi, jQuery de tüm bu tarayıcılar arası tutarsızlıkları ele alır ve farklı tarayıcılarda çalışan tutarlı bir arayüz sağlar.
• Genişletilebilirlik: Yeni olaylar, öğeler ve yöntemler kolayca eklenebilir ve ardından bir eklenti olarak yeniden kullanılabilir.

Tarih

jQuery ilk olarak Ocak 2006'da Dean Edwards'ın önceki cssQuery kitaplığından etkilenerek John Resig tarafından BarCamp NYC'de oluşturuldu . Şu anda Timmy Willison tarafından yönetilen bir geliştirici ekibi tarafından sürdürülmektedir (jQuery seçici motoru Sizzle, Richard Gibson tarafından yönetilmektedir).

jQuery aslen altında lisanslı edildi CC BY-SA 2.5 ve relicensed için MIT lisansı 2006 yılı sonunda 2006 yılında, öyleydi çift lisanslı altında GPL ve MİT lisanslar. Bu biraz kafa karışıklığına yol açtığından, 2012'de GPL kaldırıldı ve şu anda yalnızca MIT lisansı altında lisanslanıyor.

Popülerlik

• 2015 yılında jQuery, ilk 1 milyon web sitesinin (BuildWith'e göre) %62,7'sinde ve tüm İnternet web sitelerinin %17'sinde kullanıldı.
• 2017'de jQuery, ilk 1 milyon web sitesinin %69,2'sinde kullanıldı (Libscore'a göre).
• 2018'de jQuery, ilk 1 milyon web sitesinin %78'inde kullanıldı.
• 2019'da jQuery, ilk 1 milyon web sitesinin %80'inde (BuildWith'e göre) ve ilk 10 milyonun %74,1'inde (W3Techs başına) kullanıldı.
• Nisan 2021 itibarıyla jQuery, ilk 10 milyon web sitesinin (W3Techs'e göre) %77,8'i tarafından kullanılmaktadır .

Özellikleri

jQuery aşağıdaki özellikleri içerir:

• jQuery projesinin bir yan ürünü olan çok tarayıcılı açık kaynak seçici motoru Sizzle kullanılarak DOM öğesi seçimleri
• DOM'deki düğümleri seçmek için ölçüt olarak id ve sınıf gibi öğelerin adlarını ve niteliklerini kullanan CSS seçicilerine dayalı DOM manipülasyonu
• Olaylar
• Efektler ve animasyonlar
• Ajax
• Asenkron işlemeyi kontrol etmek için Ertelenmiş ve Promise nesneleri
• JSON ayrıştırma
• Eklentiler aracılığıyla genişletilebilirlik
• Özellik algılama gibi yardımcı programlar
• Modern tarayıcılarda yerel olarak kullanılabilen, ancak jQuery.inArray()ve gibi eski tarayıcılar için yedeklere ihtiyaç duyan uyumluluk yöntemleri jQuery.each().
• Çapraz tarayıcı desteği

tarayıcı desteği

jQuery 3.0 ve daha yenisi, Firefox (ve ESR), Chrome , Safari ve Edge'in yanı sıra Internet Explorer 9 ve daha yenisinin "mevcut-1 sürümlerini" (tarayıcının mevcut kararlı sürümü ve ondan önceki sürüm anlamına gelir) destekler . Mobil cihazlarda iOS 7 ve daha yenisini ve Android 4.0 ve daha yenisini destekler.

Dağıtım

jQuery kitaplığı, genellikle DOM, Events ve Ajax işlevleri dahil olmak üzere tüm arayüzlerini tanımlayan tek bir JavaScript dosyası olarak dağıtılır. Yerel bir kopyaya bağlanarak veya genel sunucularda bulunan birçok kopyadan birine bağlanarak bir Web sayfasına dahil edilebilir. jQuery, MaxCDN tarafından barındırılan bir içerik dağıtım ağına (CDN) sahiptir. Google Barındırılan Kitaplıklar hizmetinde Google ve kitaplığı da Microsoft barındırır.

Kitaplığın bir kopyasını yerel olarak bağlama örneği (Web sayfasını barındıran aynı sunucudan):

<script src="jquery-3.5.1.min.js"></script>

Kitaplığın bir kopyasını jQuery'nin genel CDN'sinden bağlama örneği:

<script
  src="https://code.jquery.com/jquery-3.5.1.min.js"
  integrity="sha256-9/aliU8dGd2tb6OSsuzixeV4y/faTqgFtohetphbbj0="
  crossorigin="anonymous"></script>

Arayüz

Fonksiyonlar

jQuery iki tür işlev sağlar : statik yardımcı işlevler ve jQuery nesne yöntemleri . Her birinin kendi kullanım tarzı vardır.

Her ikisine de jQuery'nin ana tanımlayıcısı aracılığıyla erişilir: jQuery. Bu tanımlayıcının adlı bir diğer adı vardır $. Tüm fonksiyonlara bu iki isimden herhangi biri ile erişilebilir.

jQuery yöntemleri

jQueryFonksiyonu olan fabrika bir veya daha fazla DOM düğümleri temsil eden bir jQuery nesnesi yaratmak için. jQuery nesnelerinin bu düğümleri işlemek için yöntemleri vardır. Bu yöntemler (bazen komutlar olarak adlandırılır ) , zincirlenebilirdir, çünkü her yöntem aynı zamanda bir jQuery nesnesi döndürür.

jQuery'de birden çok DOM düğümüne erişim ve bu düğümlerin işlenmesi tipik olarak $bir CSS seçici dizesi ile işlevin çağrılmasıyla başlar . Bu, HTML sayfasındaki tüm eşleşen öğelere başvuran bir jQuery nesnesi döndürür . $("div.test")örneğin, divsınıfın tüm öğelerini içeren bir jQuery nesnesi döndürür test. Bu düğüm kümesi, döndürülen jQuery nesnesindeki yöntemler çağrılarak manipüle edilebilir.

Statik yardımcı programlar

Bunlar yardımcı işlevlerdir ve doğrudan bir jQuery nesnesi üzerinde hareket etmezler. Bunlara jQuery veya $ tanımlayıcısı üzerinde statik yöntemler olarak erişilir. Örneğin, $.ajax()statik bir yöntemdir.

Çatışma yok modu

jQuery $.noConflict(), $adın kontrolünü bırakan bir işlev sağlar . Bu, jQuery, $tanımlayıcı olarak sembolü talep eden başka bir kitaplığı da bağlayan bir Web sayfasında kullanılıyorsa yararlıdır . Çatışma olmayan modda, geliştiriciler, işlevselliği kaybetmeden jQuerybir yedek olarak kullanabilirler $.

Tipik başlangıç ​​noktası

Tipik olarak jQuery, başlatma kodunu ve olay işleme işlevlerini . Bu, tarayıcı geçerli Web sayfası için DOM oluşturmayı bitirdiğinde jQuery tarafından tetiklenir. $(handler)

$(function () {
        // This anonymous function is called when the page has completed loading.
        // Here, one can place code to create jQuery objects, handle events, etc.
});

veya

$(fn); // The function named fn, defined elsewhere, is called when the page has loaded.

Tarihsel $(document).ready(callback)olarak, DOM hazır olduktan sonra kodu çalıştırmak için fiili deyim olmuştur. Ancak, jQuery 3.0'dan bu yana, geliştiricilerin $(handler)bunun yerine çok daha kısa imzayı kullanmaları teşvik ediliyor .

zincirleme

jQuery nesne yöntemleri tipik olarak, yöntem zincirlerinin kullanılmasını sağlayan bir jQuery nesnesi de döndürür :

$('div.test')
  .on('click', handleTestClick)
  .addClass('foo');

Bu satır, class niteliğine sahip tüm div öğeleri bulur test, ardından "click" olayı için her öğeye bir olay işleyicisi kaydeder, ardından her öğeye class niteliğini ekler foo.

Belirli jQuery nesne yöntemleri (durumu değiştirmek yerine) belirli değerleri alır. Bunun bir örneği, val()bir metin giriş öğesinin geçerli değerini döndüren yöntemdir . Bu durumlarda, $('#user-email').val()dönüş değeri bir jQuery nesnesine başvurmadığından zincirleme için gibi bir ifade kullanılamaz.

Yeni DOM öğeleri oluşturma

Mevcut DOM düğümlerine jQuery aracılığıyla erişmenin yanı sıra, argüman olarak $() fabrikasına iletilen dize HTML'ye benziyorsa yeni DOM düğümleri oluşturmak da mümkündür. Örneğin, aşağıdaki kod bir HTML selectöğesi bulur ve optionardından seçim menüsüne eklenen "VAG" değerine ve "Volkswagen" etiketine sahip yeni bir öğe oluşturur :

$('select#car-brands')
  .append($('<option>')
    .prop(value,"VAG")
    .text('Volkswagen')
  );

Ajax

Uzak verileri yüklemek ve işlemek için Ajax istekleri ( çapraz tarayıcı desteği ile) yapmak mümkündür $.ajax().

$.ajax({
  type: 'POST',
  url: '/process/submit.php',
  data: {
    name : 'John',
    location : 'Boston',
  },
}).then(function(msg) {
  alert('Data Saved: ' + msg);
}).catch(function(xmlHttpRequest, statusText, errorThrown) {
  alert(
    'Your form submission failed.\n\n'
      + 'XML Http Request: ' + JSON.stringify(xmlHttpRequest)
      + ',\nStatus Text: ' + statusText
      + ',\nError Thrown: ' + errorThrown);
});

Bu örnek mesajlar veri name=Johnve location=Bostonkarşı /process/submit.phpsunucuda. Bu istek bittiğinde, kullanıcıyı uyarmak için başarı işlevi çağrılır. İstek başarısız olursa, kullanıcıyı hataya, isteğin durumuna ve belirli hataya karşı uyarır.

Yukarıdaki örnek , yanıt tamamlandığında çalışan geri aramaları kaydetmek için .then()ve .catch()yöntemlerini kullanır . Bu söz geri aramaları , Ajax isteklerinin zaman uyumsuz yapısı nedeniyle kullanılmalıdır .

jQuery eklentileri

jQuery'nin mimarisi, geliştiricilerin işlevini genişletmek için eklenti kodu oluşturmasına olanak tanır . Web'de Ajax yardımcıları, Web hizmetleri , veri kılavuzları, dinamik listeler, XML ve XSLT araçları, sürükle ve bırak , olaylar, tanımlama bilgisi işleme ve kalıcı pencereler gibi çeşitli işlevleri kapsayan binlerce jQuery eklentisi bulunmaktadır .

jQuery eklentilerinin önemli bir kaynağı, jQuery Project web sitesinin eklentiler alt alanıdır. Ancak bu alt alandaki eklentiler, siteyi spam'den kurtarmak amacıyla Aralık 2011'de yanlışlıkla silindi. Yeni site, geliştiricilerin eklentilerini yeniden göndermelerini ve yeni gönderim gereksinimlerine uymalarını gerektiren GitHub tarafından barındırılan bir depodur. jQuery, kullanıcıların JavaScript'i anlamasına ve jQuery eklentileri geliştirmeye başlamasına yardımcı olabilecek bir "Öğrenim Merkezi" sağlar.

Bu eklentileri oluşturmak için geliştiriciler ya sıfırdan kendi kodlarını yazmayı ya da jQuery Boilerplate gibi mevcut bir yapının üzerine inşa etmeyi seçebilirler .

Yayın geçmişi

Test çerçevesi

QUnit , jQuery projesini test etmek için kullanılan bir test otomasyon çerçevesidir . jQuery ekibi bunu bir kurum içi birim test kitaplığı olarak geliştirdi. jQuery ekibi bunu kodunu ve eklentilerini test etmek için kullanır, ancak sunucu tarafı JavaScript kodu da dahil olmak üzere herhangi bir genel JavaScript kodunu test edebilir.

2011 yılı itibarıyla jQuery Test Ekibi kullanan QUnit ile TestSwarm her jQuery kod temeli salınımını test etmek.

jQuery'ye alternatifler

HTML belgesi geçişi, animasyon ve olay işleme gibi görevleri basitleştiren sağlam jQuery JavaScript kitaplığı, web geliştirmenin çehresini değiştirdi. Web teknolojisi araştırmacısı W3Techs'e göre, Mayıs 2019 itibariyle jQuery bilinen web sitelerinin yüzde 74'ünde kullanılıyor. Yine de, Ağustos 2006'da piyasaya sürülen jQuery kitaplığı, bazı geliştiriciler tarafından zamanı geçmiş eski bir teknoloji olarak görülüyor. Son yıllarda, Cash kitaplığı veya hatta yalnızca modern, vanilya JavaScript gibi jQuery'ye alternatifler ortaya çıktı, şimdi web tarayıcılarının tümü JavaScript'i aynı şekilde ele alıyor ve artık uyumluluk sorunlarını çözmek için jQuery'ye gerek yok. Reddit'teki argümanlar ve YouTube'daki videolar, jQuery'nin modasının geçtiğini veya en azından eskisi kadar gerekli olmadığını gösteriyor.

—  Paul Krill, Bilgi Dünyası (2019)

As çapraz tarayıcı uyumluluğu artık pek bir sorun gibidir, jQuery çoğu günümüzde çok kolaylık kaybetmeden modern web standartları ile değiştirilebilir. Kısmen bu nedenle GitHub , 2018'de jQuery'yi sayfalarından kaldırdı.

Alternatif kitaplıklar

• Peşin
• zepto

Ayrıca bakınız

• JavaScript çerçevelerinin karşılaştırılması
• jQuery Mobil
• jQuery kullanıcı arabirimi

Referanslar

daha fazla okuma

• John Resig (konuşmacı) (13 Nisan 2007). John Resig: Kitaplıklar ile JavaScript'i Geliştirme (YouTube videosu) . YUI Tiyatrosu . 9 Ocak 2018'de alındı .
• Krill, Paul (31 Ağustos 2006). "JavaScript, .Net geliştiricileri ayrı projede yardımcı oldu" . Bilgi Dünyası . 15 Nisan 2019'da alındı .
• Taft, Darryl K. (30 Ağustos 2006). "jQuery JavaScript, AJAX Geliştirmeyi Kolaylaştırıyor" . eHafta . 15 Nisan 2019'da alındı .

Dış bağlantılar

• Resmi internet sitesi