‹Terug naar zoeken

Javascript - Alma college

Raymond Asbreuk
JavaScript
1 / 10
volgende
Slide 1: Tekstslide
ICTMiddelbare schoolvmboLeerjaar 4

In deze les zitten 10 slides, met tekstslides.

time-iconLesduur is: 120 min

Onderdelen in deze les

Raymond Asbreuk
JavaScript

Slide 1 - Tekstslide

Leerdoelen
Raymond Asbreuk
Na deze kun je:
  • Uitleggen wat JS is
  • Uitleggen waar JS voor "is"
  • Uitleggen wat variabelen zijn
  • Uitleggen wat functies zijn
  • Eenvoudige logica van JS begrijpen

Slide 2 - Tekstslide

Raymond Asbreuk
Javascript: wat is het?
JavaScript is een taal waarmee je websites "levend" maakt. Het zorgt ervoor dat dingen op een website bewegen, veranderen of reageren als je bijvoorbeeld 
op een knop drukt. Zonder JavaScript zijn websites 
vaak simpel en statisch, maar met JavaScript kun je 
ze interactief en leuk maken.

Slide 3 - Tekstslide

Raymond Asbreuk
Voorbeeld
alert('Hallo Wereld')

Slide 4 - Tekstslide

Raymond Asbreuk
Hallo wereld
  <!DOCTYPE html>
  <html>
      <body>
          <button onclick='alert('Hello World')>
              knop
          </button>
      </body>
  </html>
  1. Neem de code rechts over
  2. Sla het op als:
    index-js-01.html
  3. Open het bestand
    in je browser

Wat gebeurt er?
Zie je een JS functie?

Kan je twee buttons maken die 
elk een andere zin tonen?

Slide 5 - Tekstslide

Raymond Asbreuk
Wat is een functie?
Een functie is een stukje code dat iets voor je doet. Het is alsof je een machine maakt die een taak of meerdere taken uitvoert.
  • Vergelijking:
    Stel je voor dat je een recept hebt voor een pannenkoek. Het
    recept vertelt je precies wat je moet doen en in welke volgorde.
    Elke keer als je pannenkoeken wilt maken, hoef je alleen
    maar het recept te volgen.
  • In code:
    Een functie in JavaScript werkt op dezelfde manier. Je
    "maakt" de functie (de machine) en kunt deze later
    gebruiken door hem "aan te roepen"
    (zoals op de knop drukken).

Slide 6 - Tekstslide

Raymond Asbreuk
Hallo wereld
  <!DOCTYPE html>
  <html>
      <body>
          <button onclick="hallo()">knop</button>
          <script>
             function hallo() {
                 alert('Hello World');
             }
          </script>
      </body>
  </html>
  1. Neem de code rechts over
  2. Sla het op als:
    index-js-02.html
  3. Open het bestand
    in je browser

Wat gebeurt er?

Kan je twee buttons maken die 
elk een andere functie aanroepen?

Slide 7 - Tekstslide

Raymond Asbreuk
Opdracht 3

Slide 8 - Tekstslide

Raymond Asbreuk

Slide 9 - Tekstslide

Raymond Asbreuk
Voorbeeld

Slide 10 - Tekstslide

Meer lessen zoals deze

01 - Javascript - introductie

- Les met 11 slides
ICTMBOStudiejaar 3,4

8. Interactief JavaScript-element

- Les met 16 slides
Applicatie- en mediaontwikkelaarMBOStudiejaar 1

7. Interactief JavaScript-element

- Les met 16 slides
Applicatie- en mediaontwikkelaarMBOStudiejaar 1

01 - Javascript - wat is javascript

- Les met 15 slides
ICTMBOStudiejaar 1,2

01 - Javascript - wat is javascript

- Les met 15 slides
ICTMBOStudiejaar 1,2

WEEK 2 - INFORMATICA

- Les met 32 slides
InformaticaMiddelbare schoolhavoLeerjaar 4

01 - Javascript - wat is javascript

- Les met 12 slides
ICTMBOStudiejaar 1,2

03 - Javascript - output

- Les met 10 slides
ICTMBOStudiejaar 1-4