آموزشگاه برنامه نویسی تحلیل داده
آموزشگاه برنامه نویسی تحلیل داده

آموزش انتخاب یک شی در Jquery Selector - Jquery

دوره های مرتبط با این مقاله

jQuery Selector-انتخاب گرهای Jquery:

انتخاب گرهای jQuery یکی از مهترین اعضای تشکیل دهنده ی کتابخانه jQuery محسوب می شود.
انتخاب گرهای jQuery به شما این اجازه را می دهند تا عناصر HTML را گزینش نموده و مطابق نیاز دستکاری کنید.
با انتخاب گرهای jQuery می توان المان هایHTML را با توجه به شناسه، کلاس، نوع، نام خاصیت (property)، مقدار خاصیت و ... یافت. در این روش از انتخاب گرهای CSS استفاده می شودعلاوه بر انتخاب گرهای سی اس اس ،jQuery تعدادی انتخاب گر اختصاصی نیز دارد.
تمامی انتخاب گرهای موجود در jQuery با علامت "$" آغاز و داخل پرانتز احاطه می شوند :$()

انتخاب المان بر مبنای نام آن (Element selector)

Element selector کتابخانه ی jQuery المان ها را بر اساس اسم آن ها انتخاب می نماید (به عبارتی دیگر این زمینه برای شما فراهم می کند تا المان های اچ تی ام ال را مبتنی بر نام تگ انتخاب کنید).
می توان تمامی المان های <p> روی صفحه را بدین صورت گزینش و بازیابی کرد:

                        $("p")
                    
مثال:

هنگامی که کاربر بر روی دکمه کلیک می کند، کلیه ی المان های <p> مخفی می گردند

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

انتخاب گرid#

pانتخاب گر #id ، از مقدار خصیصه ی id تگ HTML برای یافتن عنصر مد نظر استفاده می کند.
شناسه داخل یک صفحه باید تک باشد، بنابراین هنگامی که بخواهید به یک عنصر منحصر بفرد و یکتا در صفحه دست پیدا کنید از این روش استفاده نمایید.
جهت پیدا کردن یک المان با شناسه ی معین، از کاراکتر هش "#" همراه با شناسه ی مورد نظر استفاده کنید.

                       $("#test")
                    

در نمونه ی زیر، به محض اینکه کاربر بر روی دکمه کلیک کند، عنصر با شناسه "test" پنهان می گردد:

نمونه یک

امتحان کنید

انتخاب براساس اسم کلاس (.class Selector)

class Selector عناصر با کلاس معین را پیدا می کند.
به منظور یافتن عناصر با نام کلاس مشخص، از کاراکتر "." همراه با اسم کلاس مورد نظر کمک بگیرید:

                        $(".test")
                    
مثال:

به مجرد اینکه کاربر بر روی دکمه کلیک می کند، المان با کلاس "test" از نظر مخفی می شوند:

نمونه دو

    
امتحان کنید
نمونه های بیشتر از انتخاب گر های jQuery
ساختار نگارشی
شرح
$("*")
تمامی عناصر موجود را انتخاب می کند.
$(this)
عنصر فعلی را انتخاب می کند.
$("p.intro")
کلیه ی تگ های <p> با کلاس "intro" را انتخاب می کند.
$("p:first")
نخستین تگ <p>را انتخاب می کند.
$("ul li:first")
اولین آیتم از اولین عنصر <ul> را انتخاب می کند.
$("ul li:first-child")
اولین آیتم از تمام عناصر <ul> را انتخاب می کند.
$("[href]")
همه ی عناصر که دارای خاصیت href هستند را انتخاب می کند.
$("a[target='_blank']")
تمام المان های <a> که خصیصه ی target آن ها با "blank_" مقدار دهی شده باشند را انتخاب می کند.
$(":button")
تمام تگ های <button> و نیز تمام عناصر <input>ی که خصیصه ی type آنها "button" است را گزینش می کند.
$("tr:even")
کلیه ی عناصر <tr> زوج را انتخاب می نماید.
$("tr:odd")
تمامی المان های <tr> فرد را select می کند.

جایگذاری توابع مورد نیاز داخل یک فایل جدا

چنانچه وب سایت شما دربردارنده ی چندین صفحه ی متعدد است و می خواهید توابع jQuery یکسانی را در آن ها بکار ببرید، می توانید توابع یاد شده را در یک فایل مجزا که دارای پسوندمی باشد قرار دهید .js .
همان طور که در بیشتر مثال های این آموزش مشاهده می کنید، توابع به طور مستقیم داخل قسمت <head> صفحه گنجانده می شوند. با این حال، گاهی لازم است (یا توصیه می شود) که آن ها را در یک فایل مجزا جای گذاری کنید همانند این نمونه (استفاده از خصیصه ی src برای اشاره به فایل با پسوند .js):

                        <head>
                            
                            
                        </head>
                    

امیدواریم که این مطلب در مورد آموزش Jquery و JavaScript برایتان مفید و مناسب بوده باشد.
در صورت داشتن هر گونه سوال، پیشنهاد و یا انتقاد حتماً از قسمت نظرات در پایین صفحه آن را برای ما ارسال کنید.

اگر تمایل دارید به سایر محتوای آموزش برنامه نویسی دسترسی پیدا کنید می توانید به آموزش های گام به گام برنامه نویسی مراجعه کنید.

از اینجا بهترین کتابهای برنامه نویسی را دریافت کنید : کتاب های آموزش برنامه نویسی


کلیه حقوق مادی و معنوی این مقاله متعلق به آموزشگاه تحلیل داده بوده و هر گونه استفاده غیر قانونی از آن پیگرد قانونی دارد.

  • 3308
  •    2002
  • تاریخ ارسال :   1394/07/29

دانلود PDF دانلود سورس کد دانلود فیلم آموزشی دانشجویان گرامی اگر این مطلب برای شما مفید بود لطفا ما را در GooglePlus محبوب کنید
رمز عبور: tahlildadeh.com یا www.tahlildadeh.com
آموزش انتخاب یک شی در Jquery Selector - Jquery
ارسال دیدگاه نظرات کاربران
شماره موبایل دیدگاه
عنوان پست الکترونیک

ارسال
کاربر میهمان1396/05/29

تشکر

مثل همیشه عالی


آموزشگاه برنامه نویسی تحلیل داده
آموزشگاه برنامه نویسی تحلیل داده

تمامی حقوق این سایت متعلق به آموزشگاه تحلیل داده می باشد .