En son web geliştirme öğreticiler
 

jQuery Seçiciler


jQuery seçiciler jQuery kütüphanesinin en önemli parçalarından biridir.


jQuery Seçiciler

jQuery seçicileri seçmek ve HTML işlemek için izin element(s) .

jQuery seçiciler için kullanılır "find" (or select) özellikleri ve çok daha fazlası ad, id, sınıflar, türleri, nitelikleri, değerleri temel HTML öğelerini. Mevcut dayanıyor CSS Seçiciler ve ek olarak, bazı kendi özel seçiciler vardır.

JQuery tüm seçicileri dolar işareti ve parantez ile başlar: $() .


eleman Seçici

jQuery eleman seçme elemanı adına göre elemanlarını seçer.

Hepiniz seçebilirsiniz <p> Böyle bir sayfadaki öğeleri:

$("p")

Example

Bir kullanıcı bir düğmeye tıkladığında, tüm <p> elemanları gizlenecek:

Örnek

$(document).ready(function(){
    $("button").click(function(){
        $("p").hide();
    });
});
Kendin dene "

#id Seçici

JQuery #id seçici kullanan id belli maddeyi bulmak için, HTML etiketinin niteliği.

Eğer tek ve benzersiz eleman bulmak istediğinizde #id seçici kullanmalısınız böylece bir kimlik, bir sayfa içinde benzersiz olmalıdır.

Belirli bir kimliğe sahip bir öğe bulmak için, HTML öğesinin kimliği eklenen bir karma karakteri yazın:

$("#test")

Example

Bir kullanıcı bir düğmeye tıkladığında, id = "test" ile eleman gizlenecek:

Örnek

$(document).ready(function(){
    $("button").click(function(){
        $("#test").hide();
    });
});
Kendin dene "

.class Seçici

JQuery sınıf seçici belirli bir sınıf ile elemanları bulur.

Belirli bir sınıfla elemanları bulmak için, sınıfın adını ve ardından bir dönem karakteri, yazma:

$(".test")

Example

Bir kullanıcı bir düğmeye tıkladığında, class = "test" ile elementler gizlenecek:

Örnek

$(document).ready(function(){
    $("button").click(function(){
        $(".test").hide();
    });
});
Kendin dene "

jQuery seçiciler Diğer Örnekler

Sözdizimi Açıklama Örnek
$ ( "*") tüm elemanları seçer Dene
$ (This) Geçerli HTML öğesini seçer Dene
$ ( "P.intro") Tüm seçer <p> sınıfla elemanları = "intro" Dene
$ ( "P: İlk") İlk seçer <p> elemanının Dene
$ ( "Ul li: İlk") Seçer ilk <li> birinci elemanı <ul> Dene
$ ( "Ul li: first-child") Seçer ilk <li> Her unsuru <ul> Dene
$ ( "[Href]") bir href niteliği olmayan tüm unsurları seçer Dene
$ ( "A [target = '_ blank']") Bir hedefle tüm <a> elemanlar eşit değerde atfettikleri seçer "_blank" Dene
$ ( "A [hedef! = '_ Blank']") DEĞİL eşit bir hedef özellik değerine sahip tüm <a> unsurları seçer "_blank" Dene
$ ( ": Düğmesi") Tüm seçer <button> elemanları ve <input> type = "düğme" elemanları Dene
$ ( "Tr: hatta") Bütün bile seçer <tr> elemanları Dene
$ ( "Tr: garip") Tüm tek seçer <tr> elemanları Dene

Bizim kullanın jQuery Seçici Tester farklı seçicileri göstermek için.

Tüm jQuery seçiciler tam Referans için, bizim için gidin lütfen jQuery Seçiciler Referans .


Ayrı Dosya Fonksiyonlar

Web sitenizin sayfalarında bir sürü içerir ve size jQuery fonksiyonları bakımı kolay olmasını istiyorsanız, ayrı bir js dosyasında jQuery fonksiyonları koyabilirsiniz.

Bu dersimizde jQuery göstermek zaman fonksiyonları doğrudan eklenir <head> bölümünde. Ancak, bazen (kullanmak gibi ayrı bir dosyada yerleştirmek tercih edilir src .js dosyasına başvurmak için öznitelik):

Örnek

<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.2/jquery.min.js">
</script>
<script src="my_jquery_functions.js"></script>
</head>


Egzersizleri ile Yourself test edin!

Egzersiz 1 » Alıştırma 2» Egzersiz 3 » Egzersiz 4» Egzersiz 5 » Egzersiz 6»