1 / 4

A Short History of Jquery

jQuery, launched in 2006 by John Resig, transformed web development by simplifying JavaScript for DOM manipulation, event handling, and animations. It quickly became a favorite for ensuring cross-browser compatibility. However, with the rise of modern JavaScript frameworks like React and Vue, its popularity has declined. Despite this, jQuery's impact on web development remains significant, influencing how developers build interactive websites today.

James1091
Download Presentation

A Short History of Jquery

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript

  1. AShortHistoryofJquery WhatisGOOGLEMYBUSINESS Let’sgobackandreviewthehistoryoffront-enddevelopment.Manyyearsagoiffront- enddevelopershadtodofonttagsandcolorattributestheyhadtoset tags. HTMLfilesweresaturated,andifthegoalwastochangethestyleof100pages,itwas manuallydoneforeachpage.Thisscenarioplayedoutastheworstnightmareforwebdevelopers.ThenalongcameCSS.Itallowedmanagingwebpagesstylefromoneplace. Asimilarsortplayedoutfor JavaScript. JavaScriptbecamepopularbyfollowinginthefootstepsofCSS.Itwasveryeasytouse andprovidedamuchbetteruserexperience. Bymid-2000sseveralpiecesofsilvercodefromJavaScriptlibraryhadbeenreleased. SomeofthoseareMOTOOLS,PROTOTYPE,DOJO,jQueryamong manyothers. JQuerybecamethetopchoiceofdevelopersforsiteinteractivityanduser experience. HTMLReliesonstructure CSSUsedforsiteappearanceandstyling

  2. JQueryControlsthebehaviorofinteractivity WHATISJQUERY? • Yes,youreaditright.Writeless,domore.JQueryisafast,small,andfeature-rich JavaScriptlibrary.It’snosurprisethateventodayjQueryisthemostpopularlightweight libraryontheweb.ItusesthefunctionalityofJavaScripttomakeiteasyforaweb developertodonecessarytasks.Thesetasksmayinclude: • Manipulatingwebpages. • Respondingtouserevents. • Gettingdatafromwebservers. • Buildinganimationsandspecialeffects. • JQuerybuildsontopofthefunctionalitythatabrowsergivesusviaJavaScriptDOMAPI. ItsimplifiesHTMLDOM(DocumentObjectModule)treetraversal.WithjQuerytraversing, youcanstartfromanyelementandmoveup,down,andsidewaysintheDOMtree.In short,itwillperformafunctioninfarfewerlinesofcodethanearlier possible. • Wewilltrytounderstandbyusingsomeexamples: • Let’ssupposeyouwantedtoresizealltheimagesonyourwebpageorwantedtoadd someanimation.Youcouldchoosetowriteseverallinesofcode.Oryoucouldwritea singlelineofcodeandletjQuerydoalltheheavyliftingforyou.jQuerysimplymeansless codingtoachievethesameresults.NotonlythatjQuerywill alsotakecareofanycross- browserbugs,tomakelifeeasier. • DIFFERENCEBETWEENjQUERYAND JAVASCRIPT • Javascriptisaprogramminglanguage.WhilejQueryisasetcollectionoffunctionswritten usingJavascript.

  3. WHATISJQUERYUSEDFORANDWHY? jQueryprovidesasetoffunctionswritteninJavascript.Theefforthasalreadybeenput inonce.Thereisnoneedtore-writethesefunctions.WithjQuery,youjustusethem whereyouwantto.Noneedtore-inventthewheel.Therearetonsoflibrariesoutthere youcanuseforyour convenience. jQueryhasseveralbenefitsoverrawJavaScript. JQueryis cross-browserapplicable. Itsaloteasier tousethanrawJavascriptwithlesscoding. Itisextensible(mechanismavailabletoextendtheprogramminglanguage). It’ssimpleandhasrichAJAXsupport. jQuerycomeswithexcellentdocumentation. Ithasalargedevelopercommunityandoffersmanyplugins. WHATISTHEMEANINGOF$INJQUERY Hereyoucanfindoutsymbolsandtheir meaning. • PointstoRemember • Ready()functionensuresthattheDOMisfullyloaded • $Itisshortfor jQuery • Allthreeofthefollowingsyntaxesareequaltoeachother: • $(document).ready(handler) • $(). Ready(handler)thisisnot recommended • $(handler)

  4. HOWTOGETJQUERYONAWEBSITE • Herearetwo waystoaddjQueryto yourwebsite: • DownloadthejQuery libraryfromitssitewww.jquery.com. • IncludejQueryfromGoogleCDN(Content DeliveryNetwork) • Thereare2versionsavailablefordownloadingjQuery. • Productionversion–Usedforthelivewebsite.Thecodeisminifiedandcompressed. • Developmentversion–Usedfordevelopmentandtesting.Codeisreadableanduncompressed • YoucandownloadbothversionsfromthejQuerywebsite.ThejQuerylibraryisasingle javascriptfile.YoucanreferenceitwithHTML<scrip> • Note:<script>tagshouldbeinsidethetag<head> • <head> • <scriptsrc=”jquery-3.5.1.min.js”></script> • </head> • Butifyoudon’twanttodownloadandhostjQuery,youcanincludeitfromaCDN(Content DeliveryNetwork).GooglehostsjQuery,whichgoesbythenameofjQueryGoogleCDN. • GoogleCDNisthemostreliable,fast,andgloballyavailablecontentdeliverynetwork. jQueryhostedonGoogleCDNisagreatchoice.ThisisbecauseGoogleworksdirectly withallkeystakeholdersinvolved.Itupdateslibrariestothemostcurrentversionwith easeandconvenience.GooglerecommendsthatlibrariesareloadedfromCDNvia HTTPS.Thisisapplicableevenifyourwebsiteusesonly HTTP. • <head> • <scriptsrc=”https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js“> • </script> • </head> • CopyandpastetheHTMLsnippetforthelibrary(shownabove)foryourwebpage.

More Related