JQuery

jQuery Introduction

ستتعلم في هذا الدرس مقدمة عن مكتبة ال jQuery ولماذا نستخدمها وما هي مميزاتها

التاريخ

27 نوفمبر 2021

الدروس

22

المستوى

العامة

اللغة

انجليزي

المشاهدات

854

المواضيع

4
الشروحات chevron_left jQuery Introduction chevron_left JQuery

jQuery Introduction

</> jQuery Introduction

ال jQuery هي اختصار الي write less, do more وهي ان تكتب القليل وتنفذ الكثير

ال jQuery هي مكتبة صغيرة مبنية بلغة ال JavaScript صممت خصيصاً كي تكون سهلة وسريعة الاستخدام والانجاز وتوفير الوقت

يوجد بداخل jQuery  جميع الاختصارات لمعظم وظائف ال JavaScript

ال jQuery تختصر سطور عديدة مكونة من اوامر برمجية في سطر واحد فقط

ال jQuery يبسط الكثير من الاشياء المعقدة من ال JavaScript مثل ال Ajax وال DOM وال BOM

تحتوي لغة جافا سكريبت علي مميزات عديدة مثل :

  • HTML/DOM manipulation
  • CSS manipulation
  • HTML event methods
  • Effects and animations
  • AJAX
  • Utilities

ال jQuery تستطيع بناء اي مهمة برمجية داخل صفحة الويب 

هناك الكثير من مكتبات JavaScript الأخرى ، ولكن من المحتمل أن يكون jQuery هو الأكثر شيوعًا والأكثر تطوراً.

تستخدم العديد من أكبر الشركات على الويب jQuery ، مثل:

  • Google
  • Microsoft
  • IBM
  • Netflix

اختصار نفس الكود بواسطة ال jQuery

تستخدم JQuery نفس قواعد ال JavaScript مثل ال Control Flow والقواعد الشرطية وال Loops وال Functions

</> Get Started

اضافة ال jQuery لصفحات الويب

هناك طريقتين للبدء باستخدام مكتبة ال JQuery :

  • تحميل مكتبة jQuery من موقع jQuery.com
  • استخدام ال JQuery مباشرة عن طريق ال CDN l مثل Google

تحميل ال  jQuery

هناك نسختين من ال JQuery متاحين للتحميل

  • Production version قم بتحميل هذة المكتبه لانها مضغوطة وتساعد في تحميل صفحات الويب بشكل اسرع
  • Development version يستخدم هذة النسخة المطورين حتي يتمكنوا من التعديل علي المكتبة 

مكتبة ال jQuery هي عبارة عن ملف واحد JavaScript نقوم بربط هذا الملف بملف ال HTML عن طريق ال <script> بداخل ال <head> او بداخل ال <body>

ملاحظة!

يقوم المتصفح بقراءة ملف ال html من الاعلي الي الاسفل بشكل متسلسل سطرا تلو الاخر لذلك يجب عليك استدعاء ملف مكتبة ال jQuery سواء قمت بتحميله او استدعائه عن طريق CDN قبل تنفيذك لأي اوامر برمجية خاصة او قبل استدعائك لملف jQuery خارجي external

Google CDN:

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script src="js/myScript.js"></script>

Google CDN:

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script>
$(function(){
$("div").hide();
})
</script>

إحدى الميزات الكبيرة لاستخدام jQuery المستضاف من Google:

اذا قام الزوار من زيارة موقع اخر يستخدم مكتبة ال  jQuery مستضافة من Google CDN قبل زيارة موقعك الخاص. نتيجة لذلك ، سيتم تحميله من ذاكرة التخزين المؤقت عندما يزورون موقعك ، مما يؤدي إلى وقت تحميل أسرع. أيضًا ، ستتأكد معظم شبكات CDN من أنه بمجرد أن يطلب المستخدم ملفًا منه ، سيتم تقديمه من الخادم الأقرب إليهم ، مما يؤدي أيضًا إلى وقت تحميل أسرع.

</> Same Syntax

تكتب اوامر ال jQuery بثلاث طرق وهي نفس طرق كتابة ال JavaScript

  • بداخل صفحة الويب  داخل ال head 
  • بداخل صفحة الويب  داخل ال body
  • في صفحة JS منفصلة وهذة افضل طريقة

اكتب القليل ونفذ الكثير write less do more

باستخدام ال JavaScript

<script>
document.getElementById('test').style.display = 'none';
</script>

باستخدام ال JQuery

<script>
$('#test').hide();
</script>
معلومات تهمك
  • لا تنسى تقييم الدروس لكي نُحدّث المُحتوى باستمرار حتى ينال إعجابك.
  • لا تنسى مشاركة الموقع مع أصدقاءك حتى تعمّ الفائدة وتكون سبب في نفعهم.
مشاركة
0
0
0
0
عدد المشاركات
هل هذه المعلومات نالت إعجابك ؟
0
1
عدد التقييمات