[Powered by Google Translate] [سمینار: ذکر کرد که jQuery] [Vipul Shekhawat، دانشگاه هاروارد] [این CS50 است.] و [CS50.TV،] اگر شما در حال به دنبال همراه در خانه، شما در واقع می تواند اسلاید من به آنلاین دسترسی به توسط رفتن به است این ابتدا ثبت نام. این TjjRWj است، بر روی bit.ly. شما همچنین می توانید فقط به URL بروید به طور مستقیم، که است cloud.cs50.net / ~~ vshekhawat، که است نام من است است، و jQuery. من به شدت شما را تشویق به به دنبال همراه اگر شما در حال را در منزل تماشا، و اگر شما در اینجا هستید، همچنین، چرا که این یک ارائه بسیار های تعاملی است. بنابراین، امروز، من در در هستم رفتن به در مورد ذکر کرد که jQuery می شود صحبت کردن در، و این سوال های برای اولین بار نیز قرار می گیرد، آنچه که بودن jQuery است؟ این سال، من می دانم که شما بچه ها ها بر اجازه اند جاوا اسکریپت را پوشش داده نمی شوند در به عنوان بیشترین مقدار جزییات به عنوان ما را در سال های گذشته داشته است. جاوا اسکریپت را است، اول از همه، دیگر فقط یک زبان-سمت سرویس گیرنده است که شما استفاده از به اجرای اسکریپت ها و کد بر روی دستگاه هر یک از کاربر. بنابراین شما باید یک سرور است که صفحات وب را به مردم فراهم می کند، اما شما ممکن است می خواهید برای انجام مسائل بر روی دستگاه خود را، از دستگاه وی را بپرسید. چرا که برای ارسال درخواست ها به سرور خود را هر 30 ثانیه و یا چیزی شبیه به به که. شما می توانید انجام دهید که با استفاده از جاوا اسکریپت را. از jQuery فقط فراهم می کند قابلیت های بیشتر در در بالای از جاوا اسکریپت است که می کند چیزهای اضافی برای شما است. اگر شما در محتویات در نگاه بر روی از از بالا، است که توصیف می به برخی از از چیزهای است که شما در حال قادر به انجام. بنابراین در به طور کلی، آن را در ژانویه 2006 ایجاد شد شده است. این برای اولین بار از در ماه اوت سال 2005، درک می شد »شده است. آن را به در اطراف برای یک زن و شوهر سال بوده است، و آن را واقعا بخشی از جنبش جدید وب 2.0 است است که ساخته شده به اینترنت به طوری زرق و برق دار است شده است. این ترین به طور گسترده ای مورد استفاده قرار می گیرند کتابخانه جاوا اسکریپت را است. بیش از 19.6 میلیون وب سایت های در در حال با استفاده از آن، و استفاده شده است هنوز هم در حال افزایش است، با توجه به builtwith.com، که، ظاهرا، بیش از سال گذشته، به تازگی شده است به طور مداوم است نسبتا به خطی افزایش شده است. در میان 10 میلیون سایت های بالا، هنوز هم وجود دارد - در در اطراف 40٪ از آنها در حال حاضر آن را با استفاده از. فیس بوک به از آن استفاده می کند، مقدار زیادی از وب سایت های دیگر در حال حاضر آن را استفاده کنید. شما می توانید در آن دسته از آمار در خود تغییر دهید در نگاه کنید، اگر شما می خواهم. و شما می توانید حلال آن را بگویم به دلیل آن است یک پایه و اساس و 13 اعضای هیئت مدیره، در امتداد با یک تیم از 20 نفر است که بر روی آن را بر روی یک اساس به طور منظم کار می کنند. پس از آن را به بسیار به به طور گسترده ای استفاده می شود، آن را تا به یک URL سازمانهای.، آن فانتزی است، آن را تا به اسپین-آف برای چیزهای دیگر، پس از آن یک معامله بزرگ است. چرا باید آن را به شما استفاده کنید؟ از jQuery بسیار بسیار سبک وزن و است. این بدان معناست که که آن یک فایل بزرگ نیست. شما می توانید کتابچه راهنمای فایل minified، است که بدون تمام فضای سفید ها و نظرات، و آن را تنها 32 کیلوبایت است. پس از از آن آسان است است به فقط بر روی صفحه مورد نظر وب خود را بازی شیر یا خط و فقط به شروع به استفاده از آن. آن را نیز بسیار که در موثر نوشته شده است، بنابراین آن را نمی کشد تا مقدار زیادی از - آن را کند نمی کند پایین وب سایت خود را از حد زمانی که شما به از آن استفاده کنید. این به شما اجازه می دهد تا شما، چیزهایی است که که قبلا خام بودند، پیاده سازی. هستند برخی از جنبه های از قابلیت وجود دارد، مانند ایجاد انیمیشن ها، که به طور معمول امر می لازم است بسیار، بسیار دشوار است به انجام این کار است. اما کد بالا در jQuery آنها در واقع بسیار ساده است. هستند و برخی از از چیزهایی که که آزار دهنده به انجام هستند وجود دارد، ممکن است در جاوا اسکریپت را، مانند فرستادن یک درخواست POST، اما به ارسال یک درخواست به یک سرور، شما را مجبور به نوشتن پنج یا شش یا هفت خطوط از کد. در حال حاضر شما فقط می توانید آن را انجام این کار در یک خط تک از کد، در یک فراخوانی تابع تک. که واقعا ساده یک تعداد زیادی از stuff است که شما در در حال انجام است. و همه بچه ها های سرد هستند با استفاده از آن را. توسط آن، به من می منظورم این است که. در پروژه نهایی من در سال گذشته، است که است news.whrb.org، در در است که در برای ایستگاه های رادیویی است، من به این وبلاگ ایجاد که میزبان تمام را نشان می دهد است که ما انجام داده ام و در فایل های MP3 برای آنها را. شما می توانید از طریق را نشان می دهد های گذشته فهرست، و آن را به همه با استفاده از jQuery انجام می شود شده است. شما می توانید بگویید به دلیل در از تمام این انیمیشن ها شده، در اصل. بنابراین اگر شما - اگر شما در در در حال ایجاد یک ارسال جدید، شما می بینید این slideDowns کمی؛ است که همه انجام می شود با استفاده از jQuery شده است. و این محو شدن - به طوری که نوع از مسائل است که همه انجام می شود شده با استفاده از ذکر کرد که jQuery، و شما لازم نیست که به طور مداوم صفحه را بارگیری مجدد جهت حرکت به سایت استفاده نمائید شده. یکی دیگر از چیزی که سرد است که با استفاده از jQuery ساخته شده است این ارائه شده است. من با استفاده از این چیزی که منبع باز به نامیده می شود scrolldeck، که بر اساس آن فردی را در بالای از jQuery نوشت. اگر شما در واقع در منبع نگاه کنید، شما می توانید ببینید که آنها در در حال با استفاده از این علامت دلار؛ نشانه های دلار و سیگنالها کد بالا در jQuery مورد استفاده قرار گیرد به معنی که یک تابع، یک تابع بودن jQuery است. در در به طوری که آنها در حال تعریف یک لفاف بسته بندی در بالای از jQuery است که اجازه می دهد تا شما را به یک ارائه شبیه به این، و شما می توانید ببینید که در در در اینجا آنها در حال از جمله فایل جی کوئری اصلی، است که آنچه که شما باید به شامل صورتی که می خواهید به استفاده از ذکر کرد که jQuery در وب سایت های خود خود را. دست زدن به بر روی آن، چگونه می توانم شما به آن را نصب کنید؟ شما فقط می توانید رفتن به jQuery.com و دانلود کنید فایل، آن را به یک دایرکتوری وب اضافه کنید و شامل آن را. بنابراین فقط در بالای، در (جمله) از برچسب سر از فایل HTML غیر فعال خود را از فایل HTML غیر فعال اصلی خود را، فقط باید که خط از کد با نسخه درست که برای آن نسخه از jQuery شما در در حال با استفاده از. شما می توانید آن را توسط رفتن به jQuery.com آن ها را دانلود و، را کلیک کنید "ذکر کرد که jQuery دانلود،" و شما آن را کردم. همین. و در واقع، ما می توانیم یک نگاه در آنچه در آن مانند به نظر می رسد را. اگر از شما بر روی از اینجا دانلود کنید کنید کلیک کنید باید ذکر کرد که jQuery روی این است. این فقط یک فایل جاوا اسکریپت را بزرگ است که می کند تمام چیزهای سحر و جادو را برای شما است. این نسخه minified، است که در همه قابل خواندن نیست است. شما همچنین می توانید در نسخه توسعه نگاه کنید، است که قابل خواندن است اما هنوز هم بسیار، بسیار طولانی. آن است که یک تعداد زیادی از مسائل در آن وجود دارد است. شما همچنین می توانید به نسخه به میزبانی شده گوگل از آن را لینک کنید. به طوری که به دنبال شما این به شما اجازه می دهد را به فقط در گوگل تکیه می کنند به آن را ارائه شده. آنها را فراهم هر نسخه از آن را، در دسترس در تمام زمانها است. بنابراین شما احتمالا می تواند بر روی گوگل تکیه می کنند به آن را را برای شما میزبان. یا شما می توانید به خود آخرین نسخه jQuery را تحت را لینک کنید. آنها را به یک URL است که همیشه را به آخرین نسخه به روز رسانی است. آن را به از jQuery-در آخرین، و یکی از مشکل با آن وجود دارد است، آن این است که اگر که jQuery ارائه به روز شده شده و برخی از از قابلیت های قبلی آنها پس رونده و یا بد دانسته شده می شود به حال، آن ممکن است نیست - آن را ممکن است شروع به به پشتیبانی دیگر دریافت نمی. بنابراین اگر شما ارسال نامه وب سایت با استفاده از نسخه 1.8.2، توسط نسخه زمان 2.7 بیرون می آید برخی از توابع شما نوشت کار نمی کنند، دیگر. پس از آن بهتر است به فقط KB با فایل 32 را دانلود کنید، به قرار داده و آن را بر روی صفحه وب خود را، و آن را به برای همیشه لطفا برای می خواهید کار می کنند. من قصد دارم به جلو بروید و شروع به صحبت کردن در مورد قابلیت های واقعی از jQuery. اولین چیزی که انتخابگرهای است. این به این همان چیزی است که ذکر کرد که jQuery در ابتدا تصور داده شد برای ارائه شده است. و شما می توانید بر روی مستندات را کلیک کنید به در نگاه کنید شده مستندات دقیق برای انتخابگرهای من قصد دارم به شود پوشش شده است. این ایده در پشت انتخابگرهای، این است که شما می توانید عناصر HTML غیر بر روی یک صفحه را انتخاب کنید است. المان ها بر روی یک صفحه دارای ID های ها و کلاس ها و دیگر جنبه های شناسایی به آنها. همچنین وجود دارد -؛ آنها در در سفارشات مختلف. برخی از زمان آنها در حال در داخل هر یک از دیگر تو در تو شده. از jQuery اجازه می دهد تا به شما برای ساخت نمایش داده شد ساده است که عناصر از صفحه بازیابی. در سپس شما می توانید این عناصر با استفاده از توابع از jQuery دستکاری، بخش دستکاری ما خواهید به بعد دریافت کنید است که. شما می توانید HTML، تغییر CSS، را تغییر دهید شما همچنین می توانید تحریک و تشجیع کردن و اضافه کردن توابع است که در مورد رویداد های خاص را فعال. بنابراین، برای عنوان مثال، اگر چیزی کلیک، شما می خواهید چیزی است که به اتفاق می افتد، شما می توانید انجام دهید که با استفاده از jQuery را به عنوان به خوبی. هستند و یک تعداد عظیمی از راه هایی به را انتخاب کنید عناصر وجود دارد. اکثر از آنها را به من هرگز استفاده کرده ایم، اما هستند آنهایی که اساسی وجود دارد، است که عبارتند از بسیار مهم است. انتخابگر عنصر، برای عنوان مثال، اگر شما در حال فقط انتخاب هر چیزی این است که یک div - من در واقع باید کد های باز دارد برای این ارائه اسلاید. بنابراین، برای مثال است، در اینجا اسلاید برای اولین بار موجود می است. در در اینجا ما باید یک div. اگر ما در واقع را انتخاب کنید تمام divs را بر روی صفحه، آن را فقط می خواهید به ما یک آرایه از همه divs است که در این فایل وجود داشته باشد به من بدهید. انتخابگر ID به شما اجازه می دهد تا شما به هر چیزی با یک ID داده شده گرفته را انتخاب کنید. بنابراین در صورتی که این، برای عنوان مثال، این چیزی که دارای شناسه "چه،" و اگر ما این کار را با # آنچه که به جای از برخی از ID انجام داد، آن را فقط خواهد یک آرایه است که دارای یک عنصر تک و که این است که عنصر صفحه of the page است بازگشت. ما همچنین می توانیم انتخابگرهای ترکیب این راه را با داشتن تنها چیزهایی را با ID های که divs هستند را انتخاب کنید. بنابراین آره. تنها divs که دارای که ID را را انتخاب کنید. برای کلاس که شما به فقط استفاده از یک نقطه، آن را به همان چیزی که در به عنوان CSS است. نزولی (descendant) همچنین با این نسخهها کار؛ به طوری اگر شما باید برخی از کلاس و آن را تا عناصر در درون آن تو در تو - به طوری، برای عنوان مثال، است برخی از کلاس وجود دارد و آن را تا به برچسب لنگر به، لینک کنید به یک صفحه دیگر، شما می توانید این ترکیب نحوی برای بازیابی لینک ها استفاده کنید. همچنین شما می می تواند کارها را های مختلف که در یک بار را انتخاب کنید، فقط آنها را به توسط کاما از هم از هم جدا، استفاده از هر انتخابگر شما می خواهم خواهم، و به شما خواهد شد تمام را از آنها را در، در دست یک بار را انتخاب کنید، در یک آرایه واحد. و پس از آن نیز وجود دارد انتخابگر نیست، بنابراین شما می می توانید تمام divs را را انتخاب کنید ، است که انجام برخی از کلاس خاص را نداشته باشند،. و این که فقط یک راه مفید برای دریافت کنید یک مقدمه ای به به که چگونه این انتخاب با این نسخهها کار است است. من برخی از نمونه های بتن در یک ثانیه نشان خواهم داد. انتخابگرهای های های و جوی پیشرفته عبارتند از - این هستند فقط یک چند مثال. هستند ده ها تن از این وجود دارد، اما اگر شما می خواهید به را انتخاب کنید تمام برچسب های تصویر در درون برخی از عنصر، پس از آن شما فقط را انجام دهید: تصویر. اگر شما می خواهید به را انتخاب کنید عناصر های حتی، برای عنوان مثال، اگر هستند 20 از آنها را وجود دارد، شما می خواهید به را انتخاب کنید 0، 2، 4، 6 و به طوری بر روی، شما را انجام دهید: و حتی، و یا شما همچنین می توانید انجام دهید: عجیب و غریب. اینها انتخابگرهای های شبه هستند، که به معنی است که آنها در واقع محاسبه هر عنصر دیگر به و نه نسبت به به فقط رفتن و انتخاب همه از آنها. شما همچنین می توانید - هر عنصر همچنین می توانید ویژگی های خاص داشته باشند. بنابراین، برای مثال، کلاس = مرکز است همچنین یک ویژگی به. برای این برچسب لنگر، و یک عکاس هنگام عکسبرداری، در ابرمتن (hypertext) مرجع، یک ویژگی به همچنین است. آن را واقعا به طور کلی است - در در بنابراین شما می توانید چیزی است که لینک های موجود در انجمن خود را به یک صفحه خاص و یا فقط را انتخاب کنید. شما می توانید هر چیزی را با هر ویژگی است که شما می خواهم خواهم را را انتخاب کنید. و در پس از آن، همچنین، ویژگی شامل. اگر شما، برای عنوان مثال، می خواستم به را انتخاب کنید تمام عناصر های ورودی که دارای کلمه "پاس" را به عنوان به نام از آنها را به، اگر یک صفحه تا به یک بلوک متن ورودی است که "رمز عبور،" است که می شود، یکی از راه های شما می توانید از را انتخاب کنید که نامیده می شود شده است. و هستند بسیاری از از بیشتر وجود دارد. شما می توانید به به پیش بروید و نگاه کرده، سوابق خود را در مستندات و دیدن از نمونه های خاص برای از اینکه چگونه عملکرد کار آن کند است. چیزی که بعد از دستکاری DOM است. پس از ما عناصر را انتخاب کنید، ما خواهد می خواهید به در واقع انجام چیزهای با آنها. بنابراین در کنون ما اند که در آن در همه نگاه نمی، اما اگر شما در مستندات نگاه کنید، این واقعا یک حد زیادی که ما می تواند انجام دهید وجود دارد. در این نقطه، ما در در حال رفتن به را انتخاب کنید عناصر در این ارائه و دستکاری آنها را با استفاده از ذکر کرد که jQuery. از آنجا که این است که با با استفاده از jQuery اجرا می شود، در حال حاضر از دسترسی به کتابخانه JQuery می دارند، و ما می توانیم آن دسته از توابع در داخل این کد استفاده کنید. یکی از چیزی که مفید است که شما نمی ممکن است در مورد دانم. شماره های کنسول است. و گوگل کروم همان چیزی است که من با استفاده از است. شما می توانید دگرساز فرمان J را فشار دهید یا alt کنترل J به باز کردن کنسول. در به محتوای اصلی پرش به فرم جستوجو من فکر می کنم آن را فرمان از SHIFT K و یا کنترل از SHIFT K. در Safari شما باید به رفتن برخی از تنظیمات را تغییر دهید. یک لینک اگر شما می خواهم به آن را انجام دهد. وجود دارد، اما من توصیه می می کنم از گرفتن Chrome یا به محتوای اصلی پرش به فرم جستوجو. بنابراین باز تا کنسول بازی باز اجازه دهید، آن را کردن در اینجا. این اجازه می دهد تا شما به اساسا فقط انجام هر چیزی که شما می خواهید. بنابراین شما فقط می توانید در ایجاد یک متغیر به خوانده می شود x تایپ کنید، X = 5، اجازه دهید ببینیم که چه چیزی X + 2 است. شما حتی می توانید انجام چیزی شبیه به CS + بیایید ببینید که، عکسبرداری x + 45، که خواهد بود CS50. شما فقط می توانید انجام دهید برخی چیزهای جاوا اسکریپت معمولی است. اما شما همچنین می توانید jQuery را در اینجا انجام دهد. بنابراین در این جنبه برای اولین بار نگاه کنند کنید با کلیک در اینجا اجازه دهید. ما در در در حال رویم به ایجاد یک متغیر به نامیده می شود HTML، است که یک رشته است. آن را دارای یک برچسب پاراگراف در آن است، است که برخی از متن جدید نامیده می شود شده است. بنابراین ما باید این HTML، آن برخی از متن جدید است، در تگ های های پاراگراف. در حال حاضر ما در واقع می خواهم را به آن اضافه کنید به این صفحه است. من آن را راه اندازی به به طوری که HTML برای این پاراگراف، این عنوان در اینجا، است افزودنپرونده ID. اگر ما را انتخاب کنید افزودنپرونده ID و پس از آن، الحاق به آن متغیر HTML غیر من فقط ایجاد، آن را خواهد شد که HTML را اضافه کردن در پایان، درست است بعد از این برچسب پاراگراف است. بنابراین اگر ما انجام این کار - ما انتخاب این پاراگراف، و ما تابع افزودنپرونده با متغیر HTML غیر من فقط افزود نامیده می شود ام، آن را خواهد شد که متن جدید بر روی صفحه اضافه کنید سمت راست وجود دارد. و ما همچنین می توانیم در آن prepend، است که بدان معنی است از آن خواهد شد قبل از بروید، در آغاز از که عنصر. بنابراین باشد. برخی از متن جدیدی را در آغاز و پس از آن وجود دارد. من می توانید پیش بروید و (تازه کردن به). خلاص شدن از شر از این مسائل من فقط انجام داده ام. اما است که یک عنوان مثال از چگونه شما می توانید prepend را استفاده کنید است و الحاق روش به دستکاری چیزهای بر روی صفحه، اضافه کردن برخی از HTML است. شما همچنین می توانید به کلاس های زبان از تغییر. به برگشت در این فایل سبک، من این کار را برای کلاس پیروزی ایجاد کرده اید است که دارای رنگ قرمز به متن رنگ، برخی از رنگ پس زمینه، و یک سایه متنی است. این شنیع به نظر می رسد است، اما من در واقع می تواند - این پاراگراف مربوط به ID طبقاتی است. بنابراین من می توانید کلاس برای پیروزی اضافه کنید. من می توانم این کار را در کنسول اجرا، و که خواهد شد که کلاس اضافه کنید، و در حال حاضر آن را شنیع به نظر می رسد، به عنوان انتظار می رود. CSS به طور خودکار می شود به کلاس هایی است که شما استفاده شود است - اگر CSS برای یک کلاس وجود دارد، آن را به طور خودکار می شود به اعمال می شود اگر شما کلاس از یک عنصر را تغییر دهید. سپس ما فقط می توانید آن را از این موضوع حذف می را با استفاده از کلاس حذف می باشند. بنابراین اگر شما باید برخی از کلاس های های از پیش تعریف شده مانند قرمز یا هایلایت شده، و سپس شما می خواهید به درخواست کسانی که شده به عناصر، شما لازم نیست که برای انجام تمام CSS یک ظاهر طراحی شده از در هر زمان. شما فقط می توانید کلاس اضافه کنید به یک عنصر، و در پس از آن آن را به طور خودکار تبدیل خواهد شد - از آن خواهد شد به طور خودکار را نگاه برای که کلاس مناسب است. ما همچنین می تواند کارها را های را حذف کنید؛ در بنابراین من قصد دارم برای را انتخاب کنید تمام divs بر روی صفحه و حذف آنها را. چه چیزی این است که رفتن به مانند نگاه به؟ آن را به رفتن به مانند چیزی نگاه کنید، بنابراین در واقع هیچ چیز سمت چپ می شود، وجود دارد. ارائه من از بین رفته است. من می توانید بازخوانی کرده و به ارمغان بیاورد آن را به عقب، خوشبختانه، به دلیل آن را فقط در حال اجرا یک بار، اما که یک عنوان مثال از بین بردن است، اگر شما می خواهید را به طور کامل یک عنصر خاموش صفحه از بین ببرد. و شما همچنین می توانید در آن بازنویسی، و من قصد دارم به را انتخاب کنید تمام برچسب های پاراگراف بر روی صفحه از آنها و بروید در داخل آنها و جایگزین کردن متن هر چه آنها در آنها را داشته باشد با فقط کلمه "تست." اگر شما این کار، شما با این تست جایگزین هر پاراگراف بر روی صفحه. بله. آنها در حال همه ها با تست های جایگزین شده است. به طوری که یک عنوان مثال از دسترسی به متن و جای نوشتن آن را است. شما همچنین می توانید اطلاعات را بازیابی، و این است که واقعا برای جعبه های های ورودی سرد است. اگر شما باید یک جعبه ورودی است که مردم در حال تایپ کردن چیزهای به، از مردم در حال تایپ کردن چیزهای را در آن، در اینجا ما ورودی، هر برچسب ورودی با یک نوع از متن را انتخاب کنید. در این مورد، تنها یکی از جعبه ورودی در کل ارائه وجود دارد، بنابراین ما فقط می خواهید را انتخاب کنید یکی از اولین، و در پس از آن ما تابع VAL تماس بگیرید بر روی آن. که را برمی گرداند ارزش، و برای یک جعبه ورودی، ارزش است فقط به هر چه اتفاق می افتد به در داخل آن باشد در نظر گرفته شده است. بنابراین اگر ما این کار، آن را فقط چیزهای رشته را بر می گرداند. و اگر ما آن را به دوباره تماس بگیرید پس از نوشتن چیزهای بیشتری، آن را را به چیزهای بیشتر تبدیل. که یکی از راه های بزرگ برای دسترسی به عناصر از یک جعبه ورودی است، و سپس چک، است که از این یک آدرس ایمیل معتبر است، این یک تاریخ معتبر است، برای مثال. شما فقط می توانید بازیابی چیزهای به فورا به عنوان از مردم در حال آن را تایپ کردن، را تیک بزنید و سپس آن است که آیا معتبر است، ارسال آن را به عقب به یک سرور، انجام به هر چیزی که شما با آن را می خواهم. و این که چگونه شما دسترسی به آنچه در داخل کسانی که جعبه. شما همچنین می توانید CSS به طور مستقیم تغییر دهید، بنابراین به جای از اضافه کردن یک کلاس است که تا به برخی از خواص (های) از پیش تعریف شده نیست، شما فقط می توانید اضافه کردن هر CSS شما به هر چیزی می خواهید. بدن را انتخاب کنید. بنابراین اجازه دهید، در است که در آن کل ارائه را، و رنگ اموال است که تعریف می کند آنچه را که رنگ های متن است است. اگر ما آن را به قرمز را تغییر دهید، تمام متن در صفحه خواهد به به قرمز به نوبه خود. ما می توانیم چیزی شبیه به پس زمینه آبی رنگ رنگ انجام دهد، وجود دارد که ما بروید؛ آن را به زیبا است. شما می توانید هر چیزی که شما را با این می خواهید انجام دهد. با استفاده از ویژگی CSS را نمایش، شما واقعا می توانید تغییر دهید چگونه هر چیزی به نظر می رسد در هر زمان. چیزی که بعد از، اثرات است. اثرات هستند اساسا چیزی مشابه به همین به عنوان اصلاح از CSS، اما آنها در واقع برخی از انیمیشن های اضافی به آن ارائه می کنند. بنابراین به جای از به فقط نشان دادن یا پنهان کردن چیزی یا در حال تغییر رنگ، شما در واقع می تواند. آنها آن را متحرک را. در در اینجا مستندات است، اگر می خواهید را به یک نگاه در مستندات گسترده ای برای آن. اما من قصد دارم برای پوشش دادن آنهایی که اصلی. هستند نشان می دهد و خواص های مخفی کردن وجود دارد. نمایش / پنهان سازی ID در واقع به کل این جعبه مربوط، به طوری اگر من آن را پنهان کردن، آن را فقط ناپدید می شوند خواهد کرد. و من می توانم آن را دوباره به اگر من می خواهید به مطمئن آن آمده است به عقب نشان می دهد. و آن را پشت. آن را انجام داد در واقع ناپدید می شوند نیست، من نمی در واقع آن را از صفحه را حذف، من فقط مجموعه ای ویژگی CSS را نمایش از دید به پنهان ، بنابراین شما نمی می توانید آن را را به دیگر را ببینید. نیز وجود دارد اسلاید تا و اسلاید پایین، است است است که اجازه می دهد تا شما را به داشته باشند این اثر. به نظر می اسلاید تا به ناپدید می شوند، و بعد از آن از بین می رود شما می توانید آن را پایین افکت اسلاید برای را به آن آمده است به عقب داشته. و در حال حاضر آن را برگشته است. نیز این اثر را محو شدن، که وجود دارد - ID محو شدن متناظر به از این کادر. اگر من آن را محو شدن از، و سپس آن را به آرامی می خواهید ناپدید می شوند. همچنین من می می توانید آن را محو شدن در، و آن را به عقب خواهد آمد. شما همچنین می توانید وغبار، پیش به انجام دهد، است که خاص به تابع محو شدن است. شما می توانید باید آن را به هر گونه کدورت خاص است که شما می خواهید محو شدن. بنابراین اگر شما آن را محو شدن به آرامی به .5، آن را خواهید تبدیل به به نیمی از قابل مشاهده است. من می تواند به آن را به .1 بروید، و به عقب تا 1، به مطمئن آن را به طور کامل قابل مشاهده است دوباره. است که فقط یکی دیگر از انیمیشن که شما می توانید انجام دهید است است. هستند به نیز وجود دارد که از اثرات ضامن. در بنابراین من قصد دارم به را انتخاب کنید شناسه ضامن، که مربوط به از این کادر، و در آن DIV شما می توانید تماس بگیرید ضامن، اگر آن را قابل مشاهده است میکند، از بین آن را تبدیل به خواهد شد نامرئی، اگر آن را نامرئی است آن را دوباره قابل مشاهده تبدیل خواهد شد. بنابراین من فقط در دو بار نامیده می شود این تابع ضامن؛ یکی از اولین بود چیزی مشابه به همین به عنوان پنهان، تماس دوم چیزی مشابه به همین به عنوان یک نشان می دهد بود. و همچنین شما می می توانید این کار را انجام دهند با یک ضامن محو شدن، که می کند چیزی مشابه به همین، به جز آن را در واقع محو می است. و چیزی مشابه به همین با اسلاید ضامن. هستند اثرات زنجیر وجود دارد این به عنوان به خوبی، که به معنی اگر به شما یک عنصر را انتخاب کنید و. تنها کافی است تا تماس بگیرید یک دسته از روش های های انیمیشن بر روی آن،، اگر به شما می خواستم آن را به محو شدن از، پس از آن اسلاید پایین، و به پس از آن مخفی کردن و پس از آن محو شدن در، از آن خواهد شد آنها را در یک ردیف انجام دهد. بنابراین ناپدید شد، پشت آمد - برای برخی از این دلیل، که پنهان کردن اتفاق نمی افتد. اجازه دهید آن را سعی کنید از. آره، پس از آن پژمرده از و سپس آن را تضعیف دور. هستند و مقدار زیادی بیشتر وجود دارد. شما می توانید از تابع تحریک و تشجیع کردن استفاده کنید به ایجاد انیمیشن های های خود خود را، که است که نسبتا پیچیده، اما آن را به شما را فراهم می کند با توسعه پذیری بی نهایت است. شما می توانید هر نوع از انیمیشن که شما می خواهید را. همچنین شما می می توانید صف را به صف در یک زمان استفاده کنید تا انیمیشن های های های متعدد. بنابراین اگر شما می خواهید چیزی است که به پرواز در سراسر صفحه، اسلاید از سمت راست بالا به قسمت پایین سمت چپ، شما می توانید انجام این کار، و فقط باید یک دسته از اقدامات رفتن یکی پس از دیگری است. چیزی که بعد از ما در در حال رفتن به بحث در مورد رویدادی است. رویدادهای به شما اجازه می دهد - تا کنون، ما ام فقط شده است تایپ کردن چیزها را به کنسول و که یکی از راه های به سایت مورد نظر خود این اتفاق می افتد کنید است، اما بر روی یک صفحه واقعی، شما در حال رفتن نیست می شود قادر به ایجاد به نوع چیزهایی را که می بینید کاربر را به کنسول. شما می خواهید همه چیز را به به طور خودکار اتفاق می افتد. برای که، شما نیاز به، به استفاده از رویدادهای است که بر روی برخی از رویداد خاص اتفاق می افتد را را فعال کنید، می باشد. شما می توانید مستندات را را برای جزئیات بیشتر به کامل تیک بزنید. بنابراین را ببینید اجازه دهید. ما می خواهیم برای مخفی کردن و یا نشان می دهد که جعبه، اما در از سمت راست به حاضر این را فشار دهید می کند هر چیزی را انجام دهید نمی کند چرا که من آن را پیاده سازی نیست رتبهدهی نشده است. من قصد دارم برای رفتن به صفحه HTML غیر واقعی است. در اینجا اسلاید است. یک div برای اسلاید وجود دارد. از آن است که کلاس از اسلاید است. متن وجود دارد. در حال حاضر، این از از جعبه و خود به خود بر روی دکمه جعبه وجود دارد. چگونه می ما در واقع از آن شود که این ناپدید می شوند را؟ اول از همه، اجازه دهید ارسال یک تابع است است که باعث می شود ID جعبه ناپدید می شوند. در این نحو برای نشات میگیرد است، اجازه دهید است فقط آن را hideTheBox تماس بگیرید. آن را از هیچ آرگومان قبول کنند نیست، چرا که هیچ از استدلالهایی به شود گرفته شده وجود دارد. ما می توانیم ID جعبه را انتخاب کنید. بنابراین با استفاده از از jQuery را انتخاب کنید،، ما می توانیم جعبه ID را انتخاب کنید، و پس از آن به فقط مطمئن آن را ناپدید می شوند. بیایید را آن محو شدن از. اگر ما این تابع را در کنسول واقعی زد، ما می تواند این تابع، تعریف نمود؛ ما می توانیم hideTheBox تماس بگیرید، و آن را این نسخهها کار میکند. اما ما می خواهیم آن را به اتفاق می افتد هنگامی که دکمه است که در واقع فشرده. برای انجام که کار، ما مجبور به استفاده از یک رویداد. برای bind کردن یک رویداد به برخی از دکمه های خاص و یا برخی از عمل اتفاق می افتد، ما باید برای انتخاب عنصر است که این رویداد را آغاز کند - یا این که این رویداد را آغاز کند، متاسفم. بنابراین اول از همه، اجازه دهید جعبه ID دکمه را انتخاب کنید زیرا که فشار دهید، و در حال حاضر، برای آن دکمه، ما می خواهیم برای ایجاد یک انیمیشن زمانی که آن را به کلیک. پس این تابع را کلیک کنید وجود دارد. این به شما اجازه می دهد برای اتصال تابع دیگری به آن. این تابع یک تابع دیگر طول می کشد به عنوان یک استدلال ما می تواند در تابع hideTheBox عبور، و هر زمان که این دکمه کلیک، که تابع به طور خودکار اجرا خواهد شد. بنابراین این کار می کنند اگر ما را نجات دهد، من تازه کردن، و - دوم، من متاسفم. اجازه دهید من این رفع واقعا به سرعت. درست است. گرامی می رویم. بنابراین در حال حاضر جعبه ناپدید شده است هنگامی که ما با کلیک بر روی دکمه. ما همچنین می توانیم این تغییر به fadeToggle، فقط آن را تغییر دهید برای مخفی کردن و یا نشان دادن جعبه، و این نیز بیش از حد کار می کنند، اگر ما تازه کردن. ما می توانیم آن را پنهان کردن، ما همچنین می توانید آن را نشان می دهد، که به کار خود ادامه خواهد داد. یکی دیگر از چیزهایی است که ما می توانیم انجام دهیم این است، ما در واقع نه باید به تعریف این تابع hideTheBox قبل از تابع کلیک ما تماس بگیرید. بنابراین به جای تعریف تابع و خواستار hideTheBox،، ما فقط رفتن به آن تماس بگیرید در صورتی که این چیزی است کلیک. بنابراین ما می توانیم آن را تعریف ناشناس در اینجا، که یکی از ویژگی های جاوا اسکریپت می باشد. شما می توانید یک تابع را تعریف، به طور معمول، ما را تابع hideTheBox را می گویند با استدلال، اما در عوض، ما فقط می توانم بگویم تابع بدون آرگومان، شروع آکولاد برای تعریف تابع، نزدیک که آکولاد، و پس از آن فقط تابع تعریف در اینجا، در داخل پرانتز اول و آخر پرانتز که به استدلال از تابع کلیک مطابقت دارد. بنابراین ما در حال گذر در این تابع، ما می توانیم این خط از کد را در اینجا کپی کنید، و این دقیقا همان را انجام دهد. و در حال حاضر ما این تابع fadeTheBox تصادفی ندارد است که دور هم نشستهاند و بدون هیچ دلیل روشنی. تابع ناشناس تعریف شده بود، آن را نشانی از نام ندارد. آن را تنها خواهد اجرا زمانی که ما بر روی دکمه جعبه کلیک کنید. بنابراین طراوت یک بار دیگر، یک بار دیگر، و شما می توانید ببینید که هنوز کار می کند. و این که چگونه رویدادها را ایجاد می کنید. بسیاری از وقایع مختلف است که ما می توانیم با استفاده از وجود دارد. من قصد دارم به سوئیچ با استفاده از کنسول به شما نشان می دهد که چگونه این کار. شناسه برای هر یک از آنها به هر یک از جعبه مطابقت دارد. بنابراین از این کادر کلیک ID هست، این یکی ID کلیدی است، و این یکی ID ماوس است. یک چیز دیگر این است که این تابع عمل وجود دارد، به جای تایپ کردن آن را در هر زمان، من در واقع جلوتر رفت و تعریف این تابع عمل کردن در اینجا. آن را نشانی از همان تابع hideTheBox. این می شود این جعبه و یا محو و یا محو آن شوید. و به همین دلیل است که ما قادر به استفاده از آن در اینجا. بنابراین اگر ما بر روی این ID کلیک کنید کلیک کنید، ما می خواهیم به جعبه ناپدید می شوند و یا ظهور. این همان چیزی که به عنوان دکمه ی که ما در آخرین اسلاید. در حال حاضر پس ما تماس بگیرید که، ما می توانیم در این مورد کلیک کنید و جعبه ناپدید خواهند شد، سپس بر روی آن کلیک کنید دوباره و جعبه میهنم خواهد شد. این خیلی ساده است. دوبار کلیک کنید، همین، به جز آن نیاز به دوبار کلیک کنید. بنابراین اگر شما بر روی آن یک بار کلیک کنید و دوباره روی آن کلیک کنید اتفاقی نمی افتد، اما اگر شما دوبار کلیک کنید به سرعت، آن را ناپدید می شوند. اگر شما دوبار کلیک کنید، آن را به عقب خواهد آمد. به طوری که خیلی ساده است. ورودی صفحه کلید از نوع عجیب و غریب است، من فکر نمی کنم آن را در واقع در این مثال کار می کند زیرا کلید پایین، تا کلید و کلید و دیگر اقدامات کلیدی فعال بدون توجه به چه عنصر شما آن را با اتصال به. برای مثال، حتی اگر من کلید به موظف کردن به بدن و یا چیز دیگری به طور کامل، سپس آن را هنوز هم فعال بدون توجه به - آن خاص نیست. من لازم نیست به کلیک کردن بر روی این و یک کلید را فشار دهید تا هر چیزی را ناپدید می شوند. این امر می تواند بدون در نظر گرفتن عنصر من در حال حاضر شوید. فعال بنابراین این در واقع نه در این مثال کار می کنند به دلیل آن چه من به عنوان ورود به ورودی به DIV صفحه کلید ورودی به رسمیت نمی شناسد. اما اگر شما در اقدامات موس نگاه کنید، یکی از اولین شناور، و می تواند برخی از این با استفاده از CSS. اگر شما با استفاده از CSS، شما می توانید آن را به طوری که ایجاد اگر شما بیش از چیزی شناور، تغییرات سبک آن. اما با استفاده از jQuery شما می توانید سبک از چیزهای دیگر را تغییر دهید. بنابراین، برای مثال، ما در حال رفتن به تماس عمل اگر ما بیش از این دیو شناور. این بدان معناست که اگر ما بیش از آن شناور، و سپس جعبه ناپدید خواهند شد. اگر ما حرکت به دور از آن، جعبه میهنم خواهد شد. اگر ما این تماس و شناور بیش از آن، جعبه ناپدید می شوند، و به محض این که ما حرکت به دور آن می آید. اگر ما این تابع شناور می نامند در ID ماوس، که مربوط به این کادر، سپس اگر ما بیش جعبه شناور، سپس جعبه در واقع ناپدید خواهند شد - آن را بد بو که در حال حاضر، اما - اگر ما حرکت به دور از آن، آن را ظهور. در حال حاضر آن را به عقب به دلایلی. ماوس را وارد کنید و توابع حرکت ماوس تا حدودی مشابه است، اما کمی متفاوت است. ورود ماوس در تنها را فعال هنگامی که از ماوس وارد جعبه، به عنوان انتظار می رود. بنابراین اگر شما به آن حرکت می کند، آن را ناپدید می شوند. اما آن را نمی خواهد میهنم، زمانی که شما در حرکت به دور، شما باید برای حرکت به عقب بر روی آن دوباره آن را به. نیز وجود دارد که تابع حرکت موس، فعال خواهد شد هر زمان که موس حتی در جعبه وجود دارد. پس از آن فقط به در رفتن نگه دارید، محو شدن در داخل و خارج. و این در واقع ورود به سیستم - به نظر می رسد مانند آن را فقط به محو شدن در داخل و خارج، اما در واقع ورود به سیستم اقدامات بسیار بیشتری از این، بنابراین زمانی که شما در حرکت به دور آن را فقط به دلیل آن را مانند یک هزار نفر از آنها وارد شده نگه دارید. شاید نه یک هزار. شاید پنج. این سیاهههای مربوط به بیشتر از آن. نکته این است که همه اقدامات ماوس، تعداد زیادی از آنها وجود دارد. شما می توانید به خواندن در آنهایی که دیگر، اما همه آنها که اندکی متفاوت هستند، و شما می توانید انتخاب کنید هر کدام که شما نیاز دارید برای هر کدام هدف خاص شما در حال تلاش برای انجام. چیزی که بعد از من قصد دارم به بحث در مورد AJAX است. AJAX، من می دانم که ما جاوا اسکریپت را در عمق زیاد این سال را پوشش نمی دهد، بنابراین من فقط رفتن به صحبت در مورد آژاکس به طور کلی برای یک دقیقه. آژاکس مخفف جاوا اسکریپت و XML آسنکرون. اساسا، برای مثال، هنگامی که شما در فیس بوک هستید و آن را به شما اطلاع رسانی هل می دهد، که چون AJAX در حال اجرا بر روی مرورگر خود فعال کنید. هر چند ثانیه مرورگر وب شما در واقع رفتن به سرورهای فیس بوک، درخواست آنها را، آیا شما چیز جدیدی برای من، و سپس آن را به عقب به شما می آید. این اجازه می دهد تا شما برای ارسال درخواست به سرور در واقع بدون نیاز به بارگذاری صفحه. بنابراین به طور معمول، اگر شما فقط با استفاده از پی اچ پی و پایگاه داده، شما باید به تازه کردن صفحه قبل از اینکه شما می توانید اطلاعات جدید از سرور دریافت کنید. اما با استفاده از AJAX، شما می توانید برای اطلاعات جدید به طور مداوم بکشد، یا کشیدن برای آن زمانی که شما با کلیک یک دکمه و یا هر چیزی شبیه به آن. بنابراین این به ما اجازه می دهد به ارسال درخواست بدون بارگذاری مجدد صفحه، و ما می توانیم با استفاده از یا GET یا POST درخواست. دریافت درخواست، به عنوان مثال، اگر شما به Google.com و انجام آزمون = Q است. که آنها را یک آزمون پرس و جو دادن. و این یک درخواست GET به خاطر آن عبور در آن پارامترها به URL خود. درخواست POST است که اگر شما آنها را ارسال از طریق پست. آن را مانند شما آن را در نامه ای قرار داده است و کشتی آن را به آنها، اما آنها در واقع نه مطالب را ببینید. آنها در URL قابل رویت نیست. شما نمی توانید به طور مستقیم آن را تایپ کنید، شما را مجبور به ارسال آن تقریبا مخفیانه. آن را در یک پست. اما با استفاده از جی کوئری، شما می توانید درخواست GET و POST خیلی راحت تر از شما به طور معمول می تواند تنها با استفاده از جاوا اسکریپت ساده است. شما می توانید از API ها پرس و جو با استفاده از دریافت درخواست، و شما همچنین می توانید برای اطلاعات ورود به سیستم را بررسی کنید. در صفحه بعد، من این ایجاد شده، که می پرسد، "چه چیزی برای ناهار؟" با استفاده از مواد غذایی API هاروارد، بنابراین اجازه دهید که تا جلو. این فقط یک مثال از اینکه چگونه شما می توانید از jQuery برای انجام یک درخواست GET به یک API استفاده کنید و به دست آوردن اطلاعات از آن. بنابراین ما می خواهیم برای دیدن منو برای امروز، و ما می خواهیم ببینیم که چه چیزی برای ناهار. URL برای ایجاد یک درخواست GET در jQuery. شما با استفاده از دلار دریافت کنید تابع. اولین آرگومان URL است، به طوری که دقیقا همان چیزی است که شما پرس و جو. سپس استدلال بعدی یک تابع که اجرا زمانی که درخواست GET کامل است. پس شما ارسال کردن برخی از درخواست به سرور، صبر کنید تا دوباره. هنگامی که آن را دوباره، شما در حال رفتن به گرفتن برخی از اقدام با داده هایی را که از سرور. بیایید جلو بروید و کد نیز. من این کد هم نیست، بر روی هدف. TODO است. اول از همه، اجازه دهید به استفاده از اتصال رویداد به طوری که زمانی که این دکمه فشار داده شده است، ما به یک درخواست GET. و زمانی که دریافت می گرداند درخواست با برخی از داده ها، ما در حال رفتن به آن را به این غذا اطلاعات DIV ID بنویسید. اول از همه، اجازه دهید ID دکمه مواد غذایی را انتخاب کنید. هنگامی که آن کلیک، ما می خواهیم آن را به انجام کاری. اجازه دهید فقط آن را یک fuction ناشناس، مانند قبل است. آیا می توانم آن آکولاد بسته بندی، و زمانی که این دکمه فشار داده شده است، ما می خواهیم به ارسال یک درخواست GET برای بررسی آنچه برای ناهار. برای انجام این کار، ما فقط می توانید در $ تایپ کنید. دریافت کنید. این یک تابع از jQuery است، که با استفاده از علامت دلار. طول می کشد تا یک زن و شوهر از استدلال است. یکی از اولین URL است، دوم اینکه callback function، تابع که به نام وقتی که درخواست در واقع می گرداند. بیایید فقط برای اولین بار URL ساخت. ما می توانیم آن را از API که دیوید نوشت. با رفتن به اینجا، ما می توانید ببینید که آن را food.cs50.net/api/1.3/menus، و سپس شما فقط در نامهای از پارامترهای که شما می خواهم منتقل می کند. بنابراین پارامتر 1 ارزش 1 می باشد. آن را مانند تاریخ استاندارد به نظر می رسد، شروع تاریخ، پیش فرض به امروز اگر شما هر چیزی، و تاریخ پایان نیز پیش فرض را وارد کنید تا امروز اگر شما هیچ چیز را وارد کنید. این چیزی است که ما می خواهیم. ما می خواهیم فقط به گرفتن اطلاعات برای امروز. ما می خواهیم فرمت JSON باشد. که تنها دلخواه، شما می توانید هر شکلی را که می خواهید استفاده کنید. شما می توانید CSV استفاده کنید، اما JSON جاوا اسکریپت شیء نشانه گذاری است. این بسیار آسان برای به جاوا اسکریپت برای درک آنچه در آن معنی، و ما می توانیم آن را به آسانی بیشتری که در راه چاپ است. بنابراین آن درخواست در JSON بگذارید، و درخواست ناهار بیایید. بنابراین غذا = ناهار. فقط به نوشتن آن URL، ما به عقب برویم. منوها وجود دارد. اولین پارامتر خروجی = JSON چرا که آنچه ما می خواهیم و شما پارامترها با جدا و. پارامتر دوم این است - من به یاد داشته باشید. غذا. و ما می خواهیم = پودر ناهار. شما می توانید این آدرس را با تایپ کردن آن را به مرورگر شما و رفتن به آن را تست کنید. آن را به شما برخی از خروجی می دهد. این فقط یک دسته از مسائل که برای ناهار. آن را در این قالب زشت. ما می خواهیم به آن را چاپ بر روی صفحه خود را در یک فرمت بهتر. بنابراین URL درست است، در حال حاضر ما فقط نیاز به نوشتن یک تابع تماس بگیرید زمانی که درخواست موفقیت آمیز باشد. این تابع در واقع استدلال خواهد شد. این دادهها خواهند بود. داده ها همان چیزی است که می آید از درخواست GET پس از درخواست GET انجام شده است. ما می توانیم آکولاد انجام دهد، در اینجا تابع ناشناس ما که اجرا، این مزیت می باشد که استفاده از آن داده ها هنگامی که ما این اطلاعات. بنابراین داده ها، زمانی که ما در این URL تایپ، این همان چیزی است که داده ها را برای رفتن به شبیه. برای رفتن به این رشته بزرگ است. اما چیز خوبی است، JavaScript در مرورگر شما می توانید آن را با استفاده از تابع JSON.parse تجزیه. بنابراین ایجاد یک متغیر جدید به نام داده های تجزیه دهید. و تجزیه داده ها از آرایه ای از اشیاء است. هر شی حاوی اطلاعاتی مانند - خوب، اجازه دهید یک نگاهی از. این یک تاریخ، یک وعده غذایی، دسته، دستور، همه این مسائل دیگر. پس بیایید فقط چاپ کردن نام برای هر یک. بیایید تکرار بیش از مجموعه ای از مسائل است که ما از آن به عقب بر گردیم، و فقط به نسخه قابل چاپ کردن هر یک - نسخه قابل چاپ کردن نام هر یک از. این حلقه است. جاوا اسکریپت این نحو مفید که در آن شما می توانید یک متغیر و حلقه بیش از یک آرایه ایجاد کنید، و var i است فقط تکرارکننده است، بنابراین به جای داشتن به انجام VAR = 0، من کمتر از طول بود، من + +، شما فقط می توانید انجام دهید VAR من در داده های تجزیه. در این مثال، داده های تجزیه (I) به عنصر فعلی مطابقت دارد از آرایه، شی واقعی است. و ما می خواهیم برای دریافت نام از آن. پس فقط نام اجازه. و آخرین چیزی است، ما قصد داریم به برخی از jQuery دوباره. در واقع این به راستی آزمایی اطلاعات طراحی DIV این غذا اطلاعات است که در حال حاضر خالی است اضافه کنید. بنابراین انتخاب کنید که اجازه دهید. ما اطلاعات jQuery و انتخاب غذا ID دیو، و یا اطلاعات غذا ID را استفاده می کنید، ببخشید. ما می خواهیم برای الحاق به این. اگر ما آزمون، به عنوان مثال، آن را فقط آن را بازنویسی هر زمان واحد. بنابراین ما فقط می توانید اضافه کنید. عنصر موجود در آرایه، ما نام آن را دریافت کند، و ما آن را به پایان غذا اطلاعات DIV ID اضافه خواهد شد. و پس از آن فقط به آن نگاه کنید پاک کننده، ما همچنین می خواهید یک استراحت خط اضافه پس از آن همه در یک خط نیست. بنابراین اگر همه به خوبی می رود، که باید خوب باشد برای - اول از همه، هر زمان که این دکمه کلیک، آن را به این آدرس ارسال یک درخواست GET. هنگامی که داده ها می آید از آن، آن را تجزیه، با روشن کردن آن را به JSON، حلقه بیش از کل آرایه به نمایندگی از آن داده ها، و سپس اضافه نام و شکستن خط به هر خط در این وعده غذایی اطلاعات ID که قبلا خالی بود. بنابراین رفتن به این صفحه، ما را تازه کردن، کلیک کنید، پیدا کردن - آن کار نمی کند. که مایه تاسف است. و این است که در آن اشکال زدایی می آید. میکنید، خط 1. جالب است. همه حق است، به خوبی، به جای صرف زمان انجام این کار، من فقط رفتن به فایل انجام می شود که من آن را بالا بکشد، که نسخه تکمیل شده است. من مطمئن هستم که چه تفاوت است، اما ما فقط می تواند باز این تا به جای آن. و ما به AJAX، و این باید به درستی کار می کنند. این چیزی است که امروز برای ناهار، به هیچ منظور خاص، با نقل قول در اطراف آن، بنابراین آن را به زیباترین نیست. اما، بدیهی است، اگر شما این کار را برای یک پروژه نهایی شد، شما می توانید آن را بهتر نگاه کنید. اما این فقط یک نمونه مثال از اینکه چگونه شما انجام دهد درخواست GET است. و اگر ما در کد واقعی نگاه کنید، من حدس می زنم، من کاملا مطمئن هستم آن را هنوز هم تقریبا همان است. آه، من را فراموش کرده به آن تبدیل به یک رشته، که در آن است. نه، آن را هنوز هم کار نمی کند. با این وجود، در اینجا کد واقعی تکمیل شده برای چه این باید مانند نگاه، و آن همان چیزی است که من فقط اجرا. هنگامی که شما بر روی دکمه کلیک کنید، آن را با استفاده از JSON به طور خودکار تجزیه داده ها. این داده ها را برمی گرداند از آن و حلقه را از طریق کل آرایه و چاپ از - هر آنچه امروز برای ناهار، نام آن را، و اضافه خواهد شکستن خط بعد از هر خط. این که چگونه شما با استفاده از تابع GET. شما همچنین می توانید استفاده کنید، که من زمان را نداشته باشند به نوشتن به عنوان مثال برای آن، اما ما می توانیم در اسناد نگاه کنید. اگر شما در jquery.post نگاه کنید، شما می توانید ببینید که آن را تقریبا همان چیزی. شما باید یک URL، اما به جای عبور از پارامترهای با استفاده از - فقط آنها را به قرار دادن در رشته خود URL، شما باید در این متغیر داده ها به تصویب است که اساسا یک آرایه، یک فرهنگ لغت که پارامترهای نقشه ها به ارزش است. شما از عبور از آن، و است که آنها را می فرستد و در استفاده از POST. و هنگامی که شما که، پس از آن شما می توانید یک تابع موفقیت این اجرا زمانی که داده ها می آید. در غیر این صورت، آن را دقیقا همان. بنابراین با استفاده از POST، شما ممکن است بخواهید به استفاده از POST، به عنوان مثال، اگر شما یک فرم ورودی به شما اجازه مردم کلمه عبور ورودی به آن، و ارسال آن کلمه عبور کردن به اسکریپت به عقب پایان خود را، برای بررسی در پایگاه داده که آیا که کاربر معتبر است یا نه. شما می توانید انجام دهید این است که با استفاده از jQuery به جای داشتن به روز کردن صفحه در تمام. که چگونه من در این وبلاگ است که من قبلا به شما نشان داد اجرا. اگر ما به پورتال نهایی و خروج از سیستم، از سیستم خارج شوید، ورود به سیستم از کار نمی کند. خوب، اجازه دهید من فقط آن را باز کردن در یک پنجره جدید. در اینجا یک رمز عبور وجود دارد، و من که قرار بود به تایپ چیزی تصادفی. آن کار نمی کند، اما شما می توانید ببینید که ما انجام دادیم در واقع به روز کردن صفحه در همه. کد، اگر شما می خواهید به آن نگاه کنید، همه در اینجا در دسترس است. بنابراین کد من در سال گذشته نوشت: گاهی اوقات. همانطور که شما در اینجا می توانید ببینید، ما در حال ارسال یک درخواست POST. من یک فایل به نام login.php در پایان دادن به عقب، که چک در صورتی که رمز عبور صحیح است. پارامترهای ما در عبور از رمز عبور، به نقشه برداری ورودی است که در این جعبه ورودی در حال حاضر. و زمانی که داده ها می آید، بررسی می کنیم. اگر داده ها نادرست، پس ما می گویند رمز عبور نادرست، آن را اسلاید کردن، و فقط آن را پس از آن ناپدید می شوند. در غیر این صورت، ما صفحه مدیر بارگذاری. و این همه با استفاده از JSON انجام شد. در بسیاری از این خط از کد، شما فقط می توانید تصویب داده ها به پایان دادن به عقب، بررسی کنید که آیا آن درست است، بررسی کنید که آیا شما را به درستی وارد سیستم شوید و در واقع به آن پاسخ می دهند، هدایت فرد به صفحه درست یا نه به آنها اجازه وارد بخش مدیریت شوید، و گفتن آنها را که آنها رمز عبور نادرست بود. به طوری که به عنوان مثال از اینکه چگونه شما می توانید از POST از jQuery استفاده برای ارسال یک درخواست POST برای پایان دادن به پشت خود را، چک کردن اینکه آیا کسی به درستی وارد شده است. همه حق است، به طوری که تمام نمونه من تا به حال، و همه چیز من می خواستم برای پوشش. اینها چیزهایی عمده ای که از jQuery اجازه می دهد تا شما را به انجام عبارتند از: عناصر انتخاب کنید، تغییر آنها را با استفاده از دستکاری DOM، شما می توانید اثرات اضافه کردن، فعال کردن همه چیز در مورد رویدادهای خاص، و همچنین درخواست آژاکس انجام دهد بسیار یکپارچه و به آسانی. بنابراین شما برای آمدن یا تماشای تشکر می کنم، و اگر شما هر گونه سوال، فقط اجازه دهید من می دانم. آره؟ [دانش آموز] زمانی که شما نشان داد، شما JSON پس از درخواست POST در نقل قول، و من فقط تعجب بود چه که. >> آره، من می بینم. سوال این بود که در این مثال من فقط نشان داد، JSON کلمه در نقل قول در اطراف وجود دارد - من فقط آن را بکشید تا دوباره - در اطراف تابع POST. من فقط آن را کشیدن تا به نشان می دهد. بنابراین در اینجا این درخواست POST، و این JSON در نقل قول وجود دارد. که فقط تعریف آنچه که ما انتظار داریم به خروجی. بنابراین اگر ما در JSON عبور به عنوان نوع داده مورد انتظار، این یک نیاز نیست، اما اگر ما آن را در رد، سپس داده ها به طور خودکار به عنوان JSON تجزیه. بنابراین ما لازم نیست به فراخوانی تابع تجزیه JSON بر روی آن، آن را فقط می خواهید به طور خودکار اتفاق می افتد. و اگر شما را نگاهی به مستندات برای ارسال، این متغیر نوع داده، نوع داده های مورد انتظار از سرور وجود دارد. آن را به حدس هوشمند است که می تواند اشتباه پیش فرض، بنابراین شما می توانید ترک آن خالی است، اما آن را فقط به نوع داده در برنامه نویسی که استفاده می کنید، که آیا آن JSON یا XML و یا چیز دیگری. هر گونه سؤال دیگر؟ بسیار خوب. اگر شما هر گونه سؤال دیگر، احساس رایگان به من ایمیل در vshekhawat@college.harvard.edu، و اسلاید و کد باید بسیار به زودی در دسترس آنلاین می باشد. موفق باشید با پروژه های نهایی خود، امیدواریم که شما از jQuery استفاده. [CS50.TV]