جی کوئری چیست؟ نگاهی به پرکاربردترین کتابخانه جاوا اسکریپت وب

جی کوئری چیست؟

اغراق کردن تأثیر jQuery بر توسعه وب پس از انتشار کتابخانه منبع باز جاوا اسکریپت بیش از ۱۵ سال پیش دشوار است .

جی کوئری ، جعبه ابزاری که مختصر جدیدی برای برنامه نویسی پیچیده جاوا اسکریپت ایجاد کرده است ، همچنان به شعار توسعه دهندگان خود عمل می کند: «کمتر بنویس، بیشتر انجام بده».

حتی امروزه، jQuery در بین توسعه دهندگان حرفه ای محبوب است، در حالی که سایرین با تجربه برنامه نویسی کم یا بدون تجربه می توانند از کتابخانه برای افزودن قابلیت های پیشرفته به وب سایت های خود استفاده کنند. در اینجا چیزی است که پشت یکی از بزرگترین داستان های موفقیت توسعه وب وجود دارد.

جی کوئری چقدر محبوب است؟

نظرسنجی StackOverflow در سال ۲۰۲۲ از فناوری‌های وب مورد استفاده توسعه‌دهندگان حرفه‌ای نشان داد که بیش از ۲۹ درصد از بیش از ۴۵۰۰۰ پاسخ‌دهنده با jQuery کار می‌کنند.

 در میان کتابخانه‌های جاوا اسکریپت ، jQuery پس از React.js در رتبه دوم قرار داشت ، این کتابخانه برای اولین بار در فیس‌بوک (اکنون متا) در سال ۲۰۱۱ توسعه یافت و اکنون بیش از ۴۴ درصد از آن توسعه‌دهندگان آن را پذیرفته‌اند.

اما پروژه‌های فعلی توسعه‌دهندگان وب، تمام داستان را بیان نمی‌کنند. بر اساس روندهای فناوری اینترنت BuiltWith ، jQuery در بیش از ۸۰ میلیون وب‌سایت در سال ۲۰۲۲ یافت شد. این برتری نسبت به نزدیک به ۱۱ میلیون وب‌سایت دارای React است.

کتابخانه jQuery بیش از یک دهه است که با هسته وردپرس همراه شده است، و آن را در دسترس صدها موضوع قرار می دهد که به عملکرد آن برای ایجاد وب سایت های پویا متکی هستند.

دروپال یکی دیگر از سیستم های مدیریت محتوای محبوب است که جی کوئری را در میان اجزای اصلی خود قرار داده است. مهم نیست که چه فناوری هایی مورد علاقه توسعه دهندگان فعلی هستند، جی کوئری پر استفاده ترین کتابخانه جاوا اسکریپت در وب باقی می ماند.

تاریخچه مختصری از جی کوئری

نبرد مرورگرها از ابتدای راه اندازی وب آغاز شده است و توسعه دهندگان همیشه قربانی بوده اند. در سال ۲۰۰۶، زمانی که توسعه دهنده وب، جان رسیگ، جی کوئری را پرده برداری کرد، مرورگر اینترنت اکسپلورر مایکروسافت رهبر بلامنازع بازار بود – معکوس کردن مزیت نت اسکیپ کمتر از یک دهه قبل.

در آن زمان، فایرفاکس جدید موزیلا ۱۰ درصد سهم بازار (در مقایسه با ۸۴ درصد مایکروسافت) داشت و سافاری اپل به تازگی در صحنه ظاهر شده بود. کروم گوگل، رهبر بازار امروز، وجود نداشت. برنامه نویسان جاوا اسکریپت مانند Resig مرتباً برای نوشتن کدی که در همه مرورگرها اجرا می شود تلاش می کردند.

کتابخانه جدید جی کوئری او برای رفع تفاوت‌های موجود در نحوه پیاده‌سازی جاوا اسکریپت توسط آن مرورگرها ساخته شده است و به توسعه‌دهندگان کمک می‌کند تا کد کمتری بنویسند در حین انجام وظایفی مانند این:

• دستکاری کردن عناصر HTML در صفحه وب
• تغییر پویا CSS
• پاسخ دادن به رویدادهایی مانند کلیک ماوس و فشار دادن کلید
• رسیدگی به درخواست های Ajax برای به روز رسانی محتوای یک صفحه بدون بارگیری مجدد

پس از انتشار این کتابخانه توسط Resig، توسعه دهندگان دیگر برنامه هایی را در بالای jQuery ساختند و اغلب کار خود را به عنوان افزونه به اشتراک می گذاشتند تا عملکردهای جدید را در دسترس همه قرار دهند.

jQuery UI چیست؟

jQuery UI مجموعه ای محبوب از افزونه ها است که برای بهبود رابط کاربری طراحی شده است. به عنوان یک همراه “رسمی” برای کتابخانه هسته جی کوئری دیده می شود و مجموعه ای از جلوه های ویژه و ویجت هایی مانند انتخابگر تاریخ، نوارهای پیشرفت، لغزنده، اسپینرها و پانل های تب دار یا جمع شونده را اضافه می کند.

تفاوت بین jQuery و JavaScript چیست؟

مهم است که بدانید جی کوئری جاوا اسکریپت است . هنگامی که از jQuery استفاده می کنید، با نمونه هایی از اشیاء جاوا اسکریپت کار می کنید که قراردادهای نامگذاری jQuery را برای متدها (توابع) و ویژگی ها منعکس می کند.

بیایید نگاهی به وانیلی جاوا اسکریپت و جی کوئری بیندازیم و همین کار را انجام می دهیم.

در اینجا یک قطعه از HTML در جایی در یک صفحه وب آمده است:

<p id=”target”>Old text</p>

کد جاوا اسکریپت Vanilla که می تواند <p>عنصر را با id”هدف” پیدا کند – و سپس متن بین برچسب ها را جایگزین کند – می تواند به شکل زیر باشد:

const content = document.getElementById( “target” );

content.textContent = “New text”;

متد جاوا اسکریپت getElementById()یک شی را برمی گرداند که شامل HTML و محتوای متن پاراگراف با “هدف” است id. شی به مرجع ثابت اختصاص داده می شود content، سپس textContentویژگی آن به “متن جدید” تغییر می کند.

جاوا اسکریپت به شما اجازه می دهد تا متدها را زنجیره ای کنید و دستیابی به موارد فوق را با یک عبارت واحد ممکن می سازد:

 document.getElementById( “target” ).textContent = “New text”;

پس جای تعجب نیست که می‌توانید اکشن‌های جی کوئری را زنجیره‌ای کنید. برای تغییر دادن یک “متن قدیمی” به “متن جدید” با jQuery، می توانید انجام دهید:

$( “#target” ).text( “New text” );

علامت دلار ( $) نام مستعار کوتاهی است jQueryو ( “#target” )نمونه ای از انتخابگر جی کوئری است. در این حالت، انتخابگر به دنبال یک عنصر HTML با idپاراگراف هدف ما است. متد jQuery text()برای ایجاد «متن جدید» محتوای پاراگراف زنجیر شده است.

نحوه استفاده از jQuery در وب سایت شما

با پیوند دادن کد کتابخانه از صفحات سایت، جی کوئری را به وب سایت خود اضافه کنید. کتابخانه jQuery می‌تواند روی سرور وب شما یا یک شبکه تحویل محتوای قابل دسترس عموم ((CDN باشد . وب سایت رسمی jQuery می تواند شما را با آخرین نسخه های کتابخانه مرتبط کند .

کتابخانه jQuery در جاوا اسکریپت کوچک شده (فشرده) برای بارگذاری سریع در تولید یا غیر فشرده برای خوانایی و اشکال زدایی در دسترس است.

نحوه استفاده از جی کوئری در وردپرس

کتابخانه jQuery همراه با وردپرس است و جزء کلیدی بسیاری از تم های وردپرس است . حتی اگر موضوع فعلی شما از جی کوئری استفاده نمی‌کند، می‌توانید از ثبت وابستگی‌های جاوا اسکریپت در وردپرس استفاده کنید تا همه کدهای جی کوئری خود را راه‌اندازی کنید.

این کار را با ویرایش فایل functions.php که بخشی از تم شما است انجام خواهید داد . یک به‌روزرسانی تم می‌تواند آن فایل را بازنویسی کند، بنابراین تمرین خوبی است که با ایجاد یک تم فرزند و ویرایش فایل functions.php، تغییرات خود را ایمن نگه دارید . حداقل، قبل از ادامه کار ، یک نسخه پشتیبان دستی از وردپرس ایجاد کنید .