Javascript

Javascript is een programmeertaal die wordt gebruikt om websites tot leven te brengen. Je ziet het elke keer dat je een website bezoekt die interactie heeft. Javascript leren is snel, gemakkelijk en leuk omdat je al alle benodigde tools op je computer hebt staan ​​en je de resultaten direct ziet. Probeer het eenvoudige stap-voor-stap voorbeeld hieronder en u bent op weg!


Download software:Niets nodig

Kosten:Vrij

Instructies voor het instellen van software:Niets nodig

Hardware vereisten:Pc, Mac, robotica, mobiel apparaat


Ondersteunde besturingssystemen:Win, Mac, Linux

Moeilijkheidsgraad:1 van de 5



PROBEER HET!

1. Maak een map op uw harde schijf - noem deze 'JS Demo'


2. Kopieer deze Javascript-code:

 // JavaScript Document // Note: lines that start with two backslashes are comments - not code!  var bePrepared = function () {        // = = = = = = = declare all the variables = = = = = = = =         var tempF, tempC, myActionText, newText;        //get the temp (F) from the HTML page        tempF = document.getElementById('MyInputTemp').value;         // = = = = = = = convert the temp to Celsius (with only one decimal place)        tempC = (5 / 9 * (tempF - 32)).toFixed(1);        // = = = = = = = evaluate the temp (three categories) = = = = = = =         if (tempF = 60) && (tempC = 75) {                 myActionText = ' Take Sunscreen!';             }        // = = = = = = = build a complete sentence = = = = = = =         newText = 'If the temperature is ' + tempF + ' °F (' + tempC + ' °C): ' + myActionText;       //push the sentence back to the HTML page (using the ID of the markup element: 'myAnswer')       document.getElementById('myAnswer').innerHTML = newText;     }; 

En plak in je favoriete teksteditor. Windows-kladblok werkt prima.

3. Sla het bestand op als 'JS-Example.js' in de nieuwe map die u in stap 1 hebt gemaakt.

4. Kopieer nu deze HTML-code:


       Example Javascript Program for Boy Scout Merit Badge       	 	

Javascript Programming Example

Enter Temperature (°F):

En plak in je favoriete teksteditor. Windows-kladblok werkt prima.

5. Sla deze HTML-code op in dezelfde map en noem deze 'JS-HTML.htm'

6. Dubbelklik op het JS-HTML-bestand om een ​​browser te starten. Voer een temperatuur in en klik op de GO-knop om het resultaat te zien. Probeer verschillende temperaturen.


OVER HET PROGRAMMA - EEN WANDELING

1. Het HTML-bestand definieert de tekst en opmaakinformatie voor een eenvoudige webpagina. U kunt alles wijzigen wat u maar wilt om te zien hoe dit de opmaak van de pagina beïnvloedt. Dit is niet echt programmeren, maar het is leuk om mee te spelen. Het:

een. Creëert een titel voor de website
b. Vertelt de HTML-code om Javascript te gebruiken en waar de code te vinden is
c. Maakt de weergegeven tekst op
d. Specificeert een tekstinvoervak ​​met ID = 'MyInputTemp' (Javascript heeft dit nodig)
e. Specificeert een knop met het label 'Go!'
f. Wanneer de muisknop wordt ingedrukt, wordt de javascript bePrepared () -functie uitgevoerd
g. toont de string in “myAnswer” die is aangemaakt in het javascript-programma.

2. Het Javascript-bestand heeft een enkele functie genaamd 'bePrepared ().' Het wordt uitgevoerd telkens wanneer op de GO-knop wordt geklikt (kijk naar de 'onclick' -methode voor de 'input' = 'Button' -tag in het HTML-bestand om de functieaanroep te zien.)

3. De functie 'bePrepared ()'

een. Haalt de waarde op die is ingevoerd in de 'Input' - 'Text' -tag door zijn ID te gebruiken: 'MyInputTemp'
b. De waarde wordt geconverteerd naar Celcius (met een enkele decimaal).
c. De Celsius-waarde wordt geëvalueerd met een reeks IF-statements en een voorgestelde actiezin wordt toegewezen aan de variabele: 'myActionText'
d. Een zin wordt gemaakt door een aantal statische tekst te combineren of 'aaneenschakelen' samen met de temperatuurwaarden (graden F en graden C) en de actietekst.
e. De nieuwe zin wordt op de laatste regel van de HTML-pagina ingevoegd met behulp van de ID van de tag op die regel: 'myAnswer'


PROBEER DIT

1. Verander de temperaturen die in de beslissingen worden gebruikt - verander bijvoorbeeld de lagere temperatuur van 60 naar 30 graden. Zorg ervoor dat je het op twee plaatsen verandert! Sla het bestand op en vernieuw de browser (of start de webpagina opnieuw), en voer nieuwe cijfers in - zijn de antwoorden veranderd bij de nieuwe temperatuur?

2. Creëer een nieuw temperatuurbereik van 30 tot 60 graden en laat het weergeven: 'Breng hoed en handschoenen!'

3. Verander de formulering van de zinnen.

4. Voeg nog een tekstinvoer toe - vraag bijvoorbeeld naar de windsnelheid.

5. Voeg enkele voorwaardelijke uitspraken toe die de gevoelstemperatuurfactor evalueren.

6. Voeg wat tekst toe om het resultaat van de gevoelstemperatuur weer te geven.


LEER MEER

W3schools.com - Een goed georganiseerde tutorial met veel werkende voorbeelden en broncode

Webmonkey - Een vijfdelige Javascript-tutorial


HULPBRONNEN, TIPS, TRUCS EN HINTS

1. Google Chrome heeft een handige functie.

- Installeer Google Chrome als u dit nog niet heeft gedaan.

- Open het bovenstaande JS-HTML-voorbeeld in Google Chrome (klik met de rechtermuisknop op het JS-HTML-bestand dat u hierboven hebt gemaakt en selecteer 'Openen met ..' en kies Chrome)

- Klik op instellingen >> Tools >> Javascript Console

Dit opent een consolevenster met foutmeldingen (en een heleboel andere tools) om je te helpen fouten op te sporen in je code.

Deze console is erg handig bij het debuggen van javascript-fouten. De meeste browsers hebben plug-ins die vergelijkbare dingen doen.

2. Notepad ++ is een geweldige gratis teksteditor die speciaal is ontworpen voor programmeurs. Bekijk het hier .