Dus nu dat je mijn kennismaking met Jay Cory evenals mijn eigen mening op het aanleren van Jay-query en de aanpak die we hier nemen, die in het kort samen te vatten is heb gehoord dat we begonnen met vanille javascript en nu dat we zijn ervan overtuigd om dingen te doen dat de manier waarop we over verhuizen naar Jay Querrey.
Dus het eerste wat we nodig hebben om te praten over hoe we onder andere een zoekopdracht in een applicatie.
Dus ik ga om te beginnen met een zeer eenvoudige applicatie hier gewoon toe te voegen in mijn leeftijd mond en geef het een titel.
Jay queery demo Jay Jay queery altijd kleine letters.
Vraag me niet waarom Q Is hoofdletters dat alles in slechts een paar elementen.
J.
Corey demo.
Net als dat en misschien een bondgenoot of twee en deze zullen gewoon willekeurige tekst zijn.
OK dus drie bondgenoten etc. jou.
En H-1 en bespaart.
En natuurlijk gaan we verder gaan en te openen die in de browser.
En hier is onze demo pagina.
Er zijn een paar manieren om een ​​query om onze eigen applicatie en onze eigen leeftijd html-bestanden toe te voegen.
Vergeet niet dat J-query is gewoon een javascript-bestand.
Het is niet anders dan de bestanden die we tot nu toe heb geschreven.
Net als onze kleur spel ontwijken A-S of onze To Do lijst.
Ja of wat dan ook JavaScript-bestanden die we hebben gemaakt en gekoppeld met behulp van een script tag.
Dus hier beide methoden zijn we met behulp van een script tag.
Het enige verschil is de bronkenmerk.
En in dit geval zijn we koppelen aan het bestand lokaal en wat dat betekent is dat ik gedownload van de code voor een query en ze zet het in dezelfde map als mijn project en vervolgens gekoppeld ik het.
Dus ik zal je laten zien hoe we dat doen als we naar de Crew documentatie J en we klikken op download en dan moeten we een versie halen en ik ga om te gaan met de laatste die is 2,1 punt 4 en we hebben een weinig opties.
Wij kunnen de gecomprimeerde productie Jey vraag 2.0 punt 1.4 en het ongecomprimeerde ontwikkeling versie te downloaden.
Ik ga om beide te doen.
Normaal gesproken zou ik gewoon doen dit omdat het wordt samengedrukt het hele punt is dat het sneller te laden.
Maar ik wil je laten zien hoe het eruit ziet.
Dus ik ga naar de uncompress één en gecomprimeerde krijgen en je kunt zien als we twee verschillende bestanden.
We hebben Jay queery naar een punt voor Dot J.S. wijzen en we hebben J concreto 2,1 procent voor mannen.
Ja.
Dus ik ga naar deze beide openen in sublieme hier.
Gewoon slepen ze in en laten we een kijkje nemen op hen.
Dus dit bestand hier is de ongecomprimeerde versie.
En zoals ik doorlopen.
Merk op dat het is gewoon een heel lange javascript bestand.
Het is meer dan 9000 lijnen, zodat we dit bestand kunnen bevatten of kunnen we het geminimaliseerde versie, die is dezelfde code achter de schermen, maar als er iets is geminimaliseerd of gecomprimeerd alle witruimte wordt genomen bevatten.
Dus al deze rendementen alle opmerkingen zijn verdwenen en alle namen van variabelen en eigenschappen worden ingekort tot enkele personages, zodat je kunt zien dat we dingen zoals ze of we hebben dingen zoals ABC, die zijn zeker niet de namen van eigenschappen en argumenten binnen, indien het niet-gecomprimeerde bestand, zodat kunnen we onder andere één.
En om dat te doen moeten we gewoon om ervoor te zorgen dat we de bestanden toe te voegen aan de juiste directory.
Dus ik ga een nieuwe map te maken in plaats van mijn project en ik ga het lib noemen.
En we hebben niet om dit te doen.
We konden gewoon slepen onze twee bestanden in dezelfde map als onze h team.
Ik zal dienen en Ik zal beginnen met het op die manier te laten zien.
Dus ga ik open mijn H Tim L-bestand en voeg een script hier script tag en ik moet de bron gelijk en ik moet deze naam hier schrijven dat J query om een ​​punt te wijzen voor Dot J ons en we moeten dat dash.
Dus ik ga om het te kopiëren en stel gewoon de bron naar een query dash 2. 1.4.
J.
Ja en zolang dit bestand J Curry demo hem leeftijd out is op dezelfde plaats als Jay Querrey 2.1 14: 4 we goed moeten zijn.
Dus ik zal opslaan en openen het terug in de browser en vernieuwen.
Als we het openstellen van de console kunnen we eigenlijk typt u het woord J Query en druk op enter.
En als we niet een fout die ons vertelt dat de query correct is toegevoegd aan onze applicatie.
Dus een betere manier om dit te structureren is om daadwerkelijk zet deze in een aparte map met de naam van de lib gewoon zo dat we onze eigen JavaScript-bestanden uit de bibliotheek van JavaScript-bestanden kan scheiden, zodat we ze niet te verwarren en we hebben geen rommel onze directory structuur dus het is niet verplicht op alle.
Zoals je zag hadden we Jay-query werken.
Maar een betere manier om het te doen is om een ​​folder te maken en kunnen we dit alles noemen.
Noem het J-curve als je wilde.
Ik ga om te gaan met lib en dan moet ik mijn verbinding veranderen.
Mijn bron lib slash Jay-query rende naar een punt vier wijzen en ik zal de mijne te doen.
Ja, en je hoeft niet om dat te doen.
Er is geen verschil in functionaliteit.
Het enige verschil is dat dit sneller te laden maar moet die hier.
Dus nogmaals we niet allebei nodig.
We hoeven alleen maar een en we nodig hebben om correct te koppelen aan die ene.
Dus laten we controleren of het werkte.
Als ik refresh rate die goed werkt.
U kunt J zoekopdracht typt en we kunnen ook typen dollarteken en als die werk dat we weten dat blad query wordt correct geïnstalleerd.
Dus dat is de eerste manier kunnen we een query lokaal downloaden en vervolgens te koppelen aan het met de script-tag.
Er is een andere optie maar dat is een CD in de CD te gebruiken en staat voor de inhoud gedistribueerd netwerk en denken als gewoon een manier om een ​​bestand van online grijpen zonder daadwerkelijk te hoeven downloaden op je machine.
Dus laat ik je zien als we gewoon kopiëren dit je Arel hier die toevallig AJ queery CDN voor versie 2.0 1.4.
En als ik ga je gewoon naar dat je URL die u zult zien dat het is gewoon de J Corey bestand hier.
Wat we wel kunnen doen is een link naar deze u Arel of een ander J queery CD en je weet dat er veel van hen op de lijn en dat zal op dezelfde manier werken als te koppelen aan het bestand hier lokaal.
Het enige verschil is dat dit een beetje daadwerkelijk sneller geladen omdat het local op onze computer en als we vervangen door de cd dan zal het niet merkbaar ons.
Maar onder de motorkap maakt het iets langer duren, maar het is natuurlijk een stuk gemakkelijker en eenvoudiger te gebruiken omdat we niet hebben om een ​​kopie van Jay-query downloaden voor elke toepassing die we maken.
Dus ik zal vernieuwen.
En als we het type J vraag hier het moet nog steeds werken en het doet.
Tot slot zal ik je laten zien hoe ik vond dat CDN.
Gewoon openen van een nieuwe tab en kijk voor CDN Jay queery en als we gewoon een zoekopdracht voor CDN en toen een andere bibliotheek die zullen sommige andere degenen later te zien.
Mike J query.
Je zult zien dat we een heleboel links.
Dus Jay-query heeft een officiële één.
Er is de CDN Dodge City NJ s dot com en we hebben een heleboel u of anders hier dat we gewoon kunnen kopiëren.
We zouden moeten aandacht besteden aan de versie dus dit is voor 3,00.
Als we naar 2,20 punt 4, het geeft ons een uncompress de normale versie en een aangepaste versie.
En alleen maar om te laten zien als ik naar dat u goed.
Ik zie ze in een bestand bestand.
Dus om wrap up.
Hoe dan ook werkt.
We hebben een script tag in beide gevallen, maar de bron wordt ofwel naar een lokaal bestand of een bestand dat ergens dat we koppelen aan het gebruik van een CDN wordt gehost zijn.
Het laatste wat je wilt doen is het geven u een snelle 30 seconden preview van wat ze rechter eruit ziet.
Dus hier is een beetje van wat J-query eruit ziet.
Het eerste wat je zou kunnen opmerken is dat er een dollarteken wordt gebruikt in vier verschillende plaatsen.
We hebben een heleboel methoden zoals Dom klik die zie SS dot fade-out dot verwijderen.
Dus wat deze code ook daadwerkelijk doen is het selecteren van een knop met ID-trekker en wanneer het wordt geklikt loopt al deze code en wanneer het wordt geklikt we gaan om de achtergrondkleur van het lichaam te veranderen geel te zijn.
We gaan verdwijnen alle afbeeldingen op de pagina.
Het gaat om 3 seconden duren om ze te vervagen en dan wanneer de fade out gebeurt gaan we deze drie beelden van de pagina te verwijderen.
dus klik op de knop met de IDF-trekker.
Verander de carrosseriekleur uitfaden beelden meer dan drie seconden en dan beelden te verwijderen wanneer ze klaar zijn.
Oké dus dat was de snelheid voorbeeld van een query.
Laten we nu eens daadwerkelijk beginnen met het schrijven van een aantal in de volgende video.