In-depth study. Javascript & jquery. Naam: Peter Polman (106929) Datum: 25 juni 2014 Versie: 1.2

Maat: px
Weergave met pagina beginnen:

Download "In-depth study. Javascript & jquery. Naam: Peter Polman (106929) E-mail: info@peterpolman.nl Datum: 25 juni 2014 Versie: 1.2"

Transcriptie

1 In-depth study Javascript & jquery Naam: Peter Polman (106929) Datum: 25 juni 2014 Versie: 1.2

2 Inhoudsopgave Inhoudsopgave Geschiedenis Language elements Statements Variables Data Types Operators Control structures Functions Objects Events The Document Object Model Legacy DOM Intermediate DOM DOM Level 1 DOM Level 2 DOM Level 3 DOM Level 4 The Browser Object Model Document Frames History Location Navigator Screen jquery Bestaansrecht jquery Syntax jquery Plugin Reflectie

3 Geschiedenis In 1995 werd JavaScript (voorheen LiveScript) ontwikkeld door Brendan Eich, werkzaam bij Netscape Communications. Op dat moment was Microsoft bezig met de ontwikkeling van JScript. Beide talen voorzien de browser van mogelijkheden tot client-side scripting en zijn event-driven. Dit betekent dat de scripts worden uitgevoerd op processorkracht van de client (de computer van de gebruiker) en dat het script gestuurd wordt door handelingen die de gebruiker uitvoert. De talen verschilden van elkaar en werden niet door alle browsers ondersteund. JavaScript werd begrepen door alle Mozilla based browsers en JScript enkel door Internet Explorer. Om die reden ontstond op dat moment vanuit beide partijen de behoefte tot standaardisatie. De vraag aan het W3C (World Wide Web Consortium) om JavaScript te standaardiseren kwam in eerste instantie vanuit Netscape. Het W3C wees dit af en daaropvolgend stapte Netscape naar ECMA (European Computer Manufacturers Association). Omdat de merknaam JavaScript eigendom was van Sun Microsystems besloot deze dat de nieuwe standaard ECMAScript zou worden. Een taal die door alle browsers geïnterpreteerd zou moeten kunnen worden. Netscape en Microsoft gingen beiden verder met de ontwikkeling van respectievelijk JavaScript en JScript, maar baseerden deze nu op de nieuwe standaard ECMAScript. ActionScript werd in augustus 2000 geïntroduceerd door Adobe en is ook een afgeleide van de ECMA standaard. De taal wordt tegenwoordig ondersteund door Adobe Flash en Adobe Flex en is de opvolger van Adobe s Actions uit 1999, een programmeertaal die nog werd gebruikt door Flash 4. Omdat webdevelopers hier vaak niet mee uit de voeten konden is er toenadering gezocht tot het meer herkenbare ECMAScript, waardoor programmeurs nu procedureel script of objectgeoriënteerde script konden gaan schrijven. In 2003 werd ActionScript 2.0 geïntroduceerd. De taal werd steeds meer object georiënteerd, maar werd nog altijd gecompileerd naar ActionScript 1.0. Met de komst van ActionScript 3.0 en Flash Player 9 in 2006 werd hier nog een grote wijziging in aangebracht door de Flash Player van twee Virual Machines te voorzien. VM1 wordt gebruikt voor de interpretatie van AS1.0 en AS2.0 en VM2 wordt gebruikt voor de interpretatie van AS3.0.

4 Language elements Statements Met een statement wordt het commando naar de browser bedoeld. document.getelementbyid("text").innerhtml = "Hello World"; In dit voorbeeld wordt de HTML binnen het HTML element met de identifier text veranderd naar de string Hello World. Een statement wordt altijd afgesloten met een semicolon. Variables Met een variable wordt de houder voor opslag van informatie bedoeld. var x = 5; var y = 6; var z = x + y; Op regel 1 van dit voorbeeld wordt het getal 5 gedefinieerd als Number en opgeslagen in de variable met de naam x. Data Types Met de definitie van een data type wordt het soort variable bepaald. De manier waarop JavaScript hier mee omgaat is dynamisch. Dit betekent dat het soort data in de variable kan verschillen. Met de global javascript function.typeof() kan het data type van een object worden achterhaald. Een global function kan vergelijken worden met een method, maar is dan niet gekoppeld aan één specifiek object en kan dus binnen verschillende objecten gebruikt worden. String Als een variable als string is gedefinieerd betekent dit dat het een serie aan karakters opslaat welke is gedefinieerd tussen de twee dubbele of enkele quotes ( of ). Number Als een variable als number is gedefinieerd betekent dit dat het een getal mét of zonder decimalen bevat. Getallen kunnen negatief zijn en ook een

5 wetenschappelijke notatie voor extra grote of kleine getallen wordt op de juiste manier geïnterpreteerd. Boolean Als een variable als boolean is gedefinieerd kan deze twee waarden bevatten. True of false. De standaardwaarde van een boolean is false. Array Als een variable als array is gedefinieerd kan deze meerdere objecten tegelijkertijd bevatten. Deze objecten kunnen verschillen van data type en op zichzelf ook weer een array bevatten. In dit laatste geval spreken we van een multidimensionale array. De gewenste data wordt opgeroepen aan de hand van de index van het item. Het array object heeft een aantal specifieke properties en methods. Properties bevatten eigenschappen van het array object, zo kennen we binnen de array de property.length, welke de lengte van de array teruggeeft. Deze wordt vaak gebruikt om het aantal iteraties binnen een loop te kunnen vaststellen. Wanneer we een method aanroepen voeren we een bepaalde actie binnen het object uit. Het array object kent de.indexof( value ) method. Deze method geeft het index number van een bepaald item in de array terug. Een ander veelvoorkomende method is.sort(). Met deze method kunnen we de waarden binnen een array sorteren op alfabetische of numerieke volgorde, zowel oplopend als aflopend. Om de reeks van waarden in de array aflopend te maken gebruiken we de.reverse() method. Object Zo n beetje alles binnen JavaScript kan een object zijn en zijn in principe niet anders dan variables. Zelf vind ik de metafoor dingen het meest treffend. In het hoofdstuk Objects zal hier nog dieper op ingegaan worden. Undefined & null Over het algemeen worden variables netjes gedefinieerd bij de initatie van het script. Wanneer dit niet het geval is en een variable on the fly wordt aangemaakt, om bijvoorbeeld tijdelijk een waarde op te slaan, kan het voorkomen dat de variable undefined of null value teruggeeft. Op beiden zit men meestal niet te wachten, maar het verschil is wel van wezenlijk belang tijdens het debuggen van een script. Null wordt in JavaScript namelijk gezien als een object. Het Document Object Model geeft over het algemeen null terug wanneer het een bepaald element bijvoorbeeld niet kan vinden. Wanneer dit in JavaScript het geval is

6 wordt er undefined teruggegeven. Er kan een situatie voorkomen waarin je zult moeten checken of een variable null of undefined is. var x; //undefined (x == undefined)//true (x == null) //true In het bovenstaand voorbeeld wordt de equality operator (==) gebruikt. Er vindt hier ook type conversion plaats. Dat wil zeggen dat de data types van x en null kunnen verschillen, maar dat deze bij een vergelijkbare waarde gelijk wordt getrokken en de expressie alsnog true is. var x; //undefined (x === undefined) //true (x === null) //false In bovenstaand voorbeeld wordt de identity operator (===) gebruikt. Er vindt hier geen type conversion meer plaats en de uitkomst van de expressie blijkt dus ook false te zijn. Dat wil zeggen dat de data types van x en null niet overeenkomen. Operators Een operator is een karakter(reeks) welke gebruikt worden binnen de expressie. Dit kan verschillende doelen hebben. Ze worden gebruikt om variables te definiëren, berekeningen uit te voeren of condities te vergelijken. Arithmic operators Met deze operators kan het script berekeningen uitvoeren. Een variable kan gedefinieerd worden, hier kunnen getallen bij opgeteld worden of juist vanaf getrokken worden. We kunnen binnen de expressie getallen met elkaar vermenigvuldigen of juist door elkaar delen. Ook kunnen we de modulus achterhalen. De modulus wordt gebruikt om het restgetal van een deling te achterhalen. Wanneer we bijvoorbeeld willen uitvinden hoe veel seconden er overblijven als we zo veel mogelijk volle minuten uit seconden willen halen, gebruiken we de modulus. s = % 60; //s = 40 Assignment operators Met deze operators worden variables gedefinieerd. Deze variables krijgen dankzij een assignment operator data van een bepaald type toegewezen.

7 x = 0; x = Hello world ; Ook zijn er combinaties van operators mogelijk om nieuwe operators te gebruiken. Het volgende voorbeeld laat zien hoe assignment operators worden gebruikt om expressie korter te schrijven. x += 5; //Hetzelfde als x = x + 5 Ditzelfde geldt ook voor het aftrekken, vermenigvuldigen, delen door en het gebruik van de modulus. Comparison operators Binnen expressies worden operators vaak gebruikt om bijvoorbeeld het verschil of de overeenkomst van twee variables te duiden. Dit noemen we comparison operators. Bij een succesvolle uitkomst, wordt true teruggegeven. Wanneer de uitkomst niet succesvol is (het expressies klopt niet), dan wordt false teruggeven. Variable x is gelijk aan de waarde in de expressie: var x = 6; (x == 6) //true (x === 6 ) //false Variable x is niet gelijk aan de waarde in de expressie: var x = 6; (x!= 6) //true (x!== 6) //true Variable x is groter dan de waarde in de expressie: var x = 6; (x > 8) //false Variable x is kleiner dan de waarde in de expressie: var x = 6; (x < 8) //true Variable x is groter of gelijk aan de waarde in de expressie: var x = 6; (x >= 8) //false Variable x is groter of kleiner dan de waarde in de expressie: var x = 6; (x <= 8) //true

8 Logical operators Expressies kunnen aan elkaar worden uitgebreid middels logical operators. We kennen &&, en!. Hieronder volgen voorbeelden die het gebruik verduidelijken: var x = 6; (x < 8 && x == 6) //true (x is kleiner dan 8 en x is 6) (x < 8 x == 8) //true (x is kleiner dan 8 of x is 8)!(x < 8) //false (x is niet kleiner dan 8) Conditional operators Conditional operators worden gebruikt om een bepaalde waarde aan een variable toe te kennen, afhankelijk van de uitkomst van de expressie. De conditie van de variable. var x = 0.33; x = (x < 0 )? x = -1 : x = 1; //x is groter dan 1 dus de waarde van x wordt 1 Control structures Control structures worden gebruikt om het script een bepaalde kant op te sturen binnen een stuk code of een functie. We kennen if, while, do..while, for en switch statements. Hier volgen een aantal voorbeelden. if statement Wanneer de expressie binnen het if statement true teruggeeft wordt een volgend statement uitgevoerd. Wanneer dit niet het geval is, dan wordt dit statement overgeslagen. var x = 6; var i = 0; if(x > 3){ i++; console.log(i); //i is 1 Deze constructie kan ook als volgt geschreven worden. Dit geldt voor alle soorten constructies behalve de switch. var x = 6; var i = 0; if(x > 3) i++;

9 Wanneer we aan de hand van een tweede mogelijke expressie ook iets willen uitvoeren dan kunnen we het statement uitbreiden met else if(expressie){. var x = 6; var i = 0; if(x > 3){ i++; else if(x < 3) { i--; Wanneer we aan de hand van alle andere mogelijke expressies ook iets willen uitvoeren dan kunnen we het statement uitbreiden met louter else {. var x = 6; var i = 0; if(x > 3){ i++; else if(x < 3) { i--; else { i = 0; While Het while statement wordt gebruikt om een stuk code uit te voeren zolang als de expressie true is. We kunnen break of continue gebruiken om bijvoorbeeld een if statement te implementeren wat checkt of de gebruikte variable een bepaalde waarde aanneemt die de loop moet stoppen of juist moet laten doorgaan met de volgende iteratie. while (i < 10){ i++; if(i >= 5) break; console.log(i); //Logt 1,2,3 en 4. Do while Dit statement is vergelijkbaar met het while statement, met als verschil dat het de code achter do in ieder geval één maal uitvoert en vervolgens de while loop ingaat. do { i++; while (i < 10);

10 For De for loop is wederom vergelijkbaar met de while loop, met als verschil we deze op 1 regel kunnen schrijven. De benodigde argumenten in dit statement zijn dan initialization, conditition en step. Ook binnen de for loop zijn break en continue te gebruiken om het script respectievelijk te stoppen of door te laten gaan met de eerstvolgende iteratie. for (var i = 0; i < 10; i++){ console.log(i); //Logt 0,1,2,3,4,5,6,7,9 Loops worden veelal gebruikt in samenwerking met arrays. De.length property komt dan goed van pas om de laatste iteratie te bepalen. Hieronder volgt een voorbeeld van deze toepassing. a = ["een","twee","drie"]; for (var i = 0; i < a.length; i++){ console.log(a[i]); //Logt een, twee, drie For in Naast de standaard for loop, die veelal wordt gebruikt om arrays uit te lezen, bestaat er ook de for in loop. Deze wordt toegepast om de waarden van objecten uit te lezen. Zie onderstaand voorbeeld voor een mogelijk toepassing. var object = {een : 1, twee : 2, drie : 3 for (value in object){ console.log(object[value]); //Logt 1, 2, 3 Switch Het switch statement evalueert een expressie en bepaalt aan de hand van het resultaat de flow binnen de control structure. De expressie wordt vergeleken met een de case label, welke enkel een constante waarde mag bevatten, en als deze true wordt bevonden wordt het bijbehorende statement uitgevoerd. switch(x){ case 1: console.log( x is 1 ); break;

11 case 2: console.log( x is 2 ); break default: console.log( x is iets anders dan 1 of 2 ); break; In de basis is het switch statement vergelijkbaar met het if statement. Qua performance wint de switch het echter van het if statement. Bij het if statement worden de condities namelijk op volgorde gecheckt terwijl een switch direct naar het betreffende case label springt en de code uitvoert. Functions Parameters Een functie is een blok specifieke code welke wordt uitgevoerd op het moment dat de functie wordt aangeroepen. Een functie kan bepaalde parameters met zich meedragen, deze vinden we tussen de haakjes (()). Local & Global variables Wanneer de functie bepaalde waardes ontvangt, hebben deze waarden een lokale scope. Dat wil zeggen dat ze enkel binnen de functie gebruikt kunnen worden. De variables die buiten de functie worden gedefinieerd noemen we global variables. Dat wil zeggen dat de variable binnen de volledige web pagina te gebruiken is. Local variables worden verwijderd wanneer de functie is uitgevoerd en de global variables worden verwijderd wanneer de web pagina wordt afgesloten. Syntax De syntax van een functie luidt als volgt: function custom_function(param1, param2) { return param1 * param2; x = custom_function(arg1, arg2); Return Dit statement geeft de caller, het statement wat de functie aanroept, van de functie een waarde terug en stopt de functie. Zie de toepassing van de bovenstaande functie in onderstaand voorbeeld. x = custom_function(3, 4); //x = 12

12 Objects Zoals we eerder bij het deelonderwerp objects in het hoofdstuk Language Elements behandelden, kan zo n beetje alles binnen JavaScript een object zijn. We gebruikten hier de metafoor dingen. Properties Deze dingen, ofwel objecten, hebben specifieke eigenschappen. Zo kan een object rood of groen zijn. We hebben het dan over de property color van het object. Deze kan opgevraagd worden door bijvoorbeeld de property object.color aan te roepen. Methods Naast dat deze objecten bepaalde eigenschappen hebben kunnen zij ook methods met zich meedragen. Methods zijn bepaalde acties die binnen het object uitgevoerd kunnen worden. Zoals bij het object array reeds beschreven kunnen deze methods iets doen met de waarden die het object bevat. Syntax Er zijn verschillende manieren om objecten te creëren, de meest eenvoudige is de object literal. Hiermee kunnen we binnen één statement het object zowel creeren als definiëren. De literal bevat een reeks van names en values door komma s gescheiden. var person = {firstname : "Peter",lastName : "Polman",age : 25; Een andere manier om het object te creëren en te definiëren luidt als volgt: var person = new Object(); person.firstname = "Peter"; person.lastname = "Polman"; person.age = 25; Accessing properties De eigenschappen van een object zijn op twee verschillende manieren te benaderen. De eerste luidt als volgt: firstname = person.firstname; We kunnen een eigenschap ook opvragen met een syntax die vergelijkbaar is met die van de array. In dit geval is het mogelijk om de key een variable van het type String te laten zijn. In tegenstelling tot arrays is het bij objecten niet mogelijk om een Number als key te gebruiken.

13 key = firstname ; firstname = person[key]; Accessing methods Een method is in principe niets anders dan een functie gedefinieerd als property binnen een object. Deze functie kan dus voorzien worden van parameters en andere properties binnen het object gebruiken. var object = { firstname : "Peter", lastname : "Polman", age : 25, fullname : function(){ return object.firstname + " " + object.lastname; In het bovenstaande voorbeeld kan de custom method.fullname() aangeroepen worden om zowel de voor- als achternaam te loggen. In dit geval dus Peter Polman. Events HTML Events zijn dingen die gebeuren met HTML elementen. JavaScript kan gebruikt worden om op deze events te reageren. Deze events zijn te verdelen in dingen die de browser doet, of dingen die de user doet. Handlers HTML elementen kunnen voorzien worden van JavaScript event handler attributes. De handler kan een call naar een functie maken of een stuk script uitvoeren. Als we een custom functie willen aanroepen op het moment dat er op een HTML element wordt geklikt, dan kunnen we dit als volgt schrijven. <button onclick= console.log(this.innerhtml) >Click me!</button> <!-- Logt Click me! --> Built-in events zijn onder te verdelen in de volgende categorieën: Mouse Events, Keyboard Events, Frame/Object Events en Form Events. Event Object Het event object bevat standaard een aantal constants, properties en methods. We zullen er hier per categorie een paar behandelen. Constants

14 Een event maakt een aantal fasen door, de constants in het object beschrijven deze fasen en luiden respectievelijk: CAPTURING_PHASE (1), BUBBLING_PHASE (2), AT_TARGET (3). Middels de property eventphase, kunnen een van deze drie waarden uitlezen. De numbers achter de names zullen dan teruggegeven worden. Properties Properties kunnen in een functie (getriggerd door een event) informatie over het event geven. Het argument event dient dan wel als parameter meegeven te worden. eventphase kennen we reeds, daarnaast kunnen we nog properties oproepen die iets over de targetting zeggen, zoals currenttarget en target. Dit kan handig zijn op het moment dat het target van de functie wisselt. De notatie luidt als volgt: <script> function custom_function(e){ return console.log(e.currenttarget.innerhtml); //Logt Click me! </script> <button onclick="custom_function(event)">click me!</button> Met de intrede van DOM level 3 zijn er naast de standaard built-in events een aantal nieuwe Keyboard Event properties toegevoegd, te weten: keyidentifier en keylocation. Deze nieuwe properties kunnen de locaties en identifiers van de toetsen op het toetsenbord worden uitgelezen, zodat het nu ook in de browser mogelijk is om meer toetsen dan de reeds toegankelijke alt, shift en de ctrl toets te gebruiken. Custom events (non built-in) Naast de built-in events bestaan er ook mogelijkheden om custom events aan te maken. Op de ouderwetse manier werd hier gebruik gemaakt van onder andere de in de voorgaande paragraaf genoemde method initevent(). var custom_event = new Event('build'); element.addeventlistener('build', function (e) { /* custom code */, false); element.dispatchevent(event); Methods

15 Een deprecated method is initevent(). We gebruiken tegenwoordig over het algemeen de method addeventlistener(), omdat deze het event zowel aanmaakt als koppelt en initieert. De method dispatchevent() wordt nog wel gebruikt om deze custom events te firen. preventdefault() is te vergelijken met stoppropagating(, aangezien zij beiden dienen om capturing en bubbling in goede banen te geleiden. preventdefault() voorkomt dat het event zijn default actie uit gaat voeren nadat het event is getriggerd. stoppropagating() voorkomt dat het event uberhaupt nog acties gaat uitvoeren aangaande de volgorde van de getriggerde events. In de volgende paragraaf wordt het fenomeen capturing & bubbling nader toegelicht. Capturing & Bubbling Er bestonden voor DOM level 2 twee verschillende event models. Dit kan ik het best uitleggen aan de hand van een voorbeeld waarin één element in een ander element zit en zij beiden een onclick handler met zich meedragen. Als je op het binnenste element zou klikken, welke event wordt dan als eerst getriggerd? Die van het omsluitende, of die van het binnenste element? element element Netscape en Microsoft hadden hiervoor beiden een verschillende benadering. Netscape stelt dat het event op het omsluitende element als eerste getriggerd zou moeten worden. Dit noemen we capturing element element2 \ / Event CAPTURING

16 Microsoft stelt dat het event op element2 als eerste getriggerd zou moeten worden en element 1 daarop volgt. Dit noemen we bubbling. / \ element element Event BUBBLING Eind 2000 stelde W3C hier een standaard voor in DOM Level 2. De oplossing was een compromis tussen beiden en laat zich als volgt verbeelden. / \ element element2 \ / W3C event model Ontwikkelaars hebben nu de vrijheid om te kiezen of ze willen capturen of bubblen door de derde parameter in de EventListener te voorzien van een boolean. element.addeventlistener( click, custom_function(), true); //set to capture element.addeventlistener( click, custom_function(), false); //set to bubble Middels de property bubbles kan worden uitgelezen of een event een bubbling event is of niet (true of false).

17 JSON The student can construct and explain a JSON string. JSON staat voor JavaScript Object Notation. Het is een syntax voor het opslaan en uitwisselen van data en een eenvoudiger alternatief voor XML. Omdat JSON identiek is aan de wijze waarop objecten binnen JavaScript worden genoteerd, hoeft er geen parsing plaats te vinden zoals bij het interpreteren van XML het geval is. Dit scheelt tijd en scoort daarmee performance punten. De syntax van JSON objecten is gelijk aan die van JavaScript objecten. Dit komt waarschijnlijk niet als verrassing, maar toch bestaat er nog een verschil. Binnen het JSON object kunnen namelijk geen functies worden opgenomen, daar het model enkel geschikt is voor de opslag van objecten..eval() en.parse() Eval wordt binnen JavaScript gebruikt om bepaalde programma s te compilen en uit te voeren. Deze functie is al heel erg krachtig, maar voor JSON is er een nog snellere functie beschikbaar. De parse() method is specifiek bedoeld voor JSON en dient door de browser ondersteund te worden. Wanneer dit niet het geval is zal worden teruggevallen op de eval() method..stringify() Stringify doet in weze het omgekeerde van de parse method. De stringify method interpreteert een JavaScript object en vertaalt dit naar een string. Deze string kan vervolgens ergens worden opgeslagen, om op een later moment door de parse() method weer uitgelezen te kunnen worden. var object = { firstname : "Peter", lastname : "Polman", age : 25 var objectstr = JSON.stringify(object); //Vervolgens kan de string ergens worden opgeslagen. var JSONObj = JSON.parse(objectStr); //Nadat de string weer geparsed is kan deze weer als object gebruikt worden binnen het script.

18 The Document Object Model Het Document Object Model is een Application Programming Interface (API). Het zorgt voor de structurele interpretatie en weergave van documenten en biedt mogelijkheid tot interactie. Deze structuur wordt de document tree genoemd en browsers kunnen deze informatie parsen om de uiteindelijke visuele weergave te produceren. Het DOM Level wordt gehanteerd om een verzameling aan specificaties van DOM objecten, methods en behaviours te beschrijven. Met een nieuw DOM level kunnen volledig nieuwe specificatie categorieën toegevoegd worden en daarnaast kunnen veranderingen enkel toevoegen of aanpassingen op bestaande specificaties zijn. Legacy DOM Het ontstaan van het DOM (DOM Level 0) is sterk gekoppeld aan het ontstaan van JavaScript en JScript. Op dit moment ontstond er een sterke behoefte aan het direct kunnen aanspreken van specifieke elementen binnen een document. Iets waar toentertijd nog geen onafhankelijke standaard voor was. Intermediate DOM Toen in 1997 Dynamic HTML werd ondersteund door de browsers van Netscape en Microsoft, werden er vanuit beide partijen verschillende uitbreidingen gedaan op de Legacy DOM. We spreken in deze periode van Intermediate DOM. Nog steeds waren deze uitbreidingen browser afhankelijk en na het uitbrengen van de standaard ECMAScript, ging het W3C zicht dan ook bezig houden met het opstellen van een standaard voor de interpretatie van deze scripts. DOM Level 1 In 1998 bracht het W3C DOM Level 1 uit. De DOM API is platform en taal onafhankelijk en browsers dienden gebruik te maken van deze API om op die manier de interpretatie van het script op verschillende browsers te kunnen bewerkstelligen. DOM Level 2 Eind 2000 werd level 2 geïntroduceerd. De getelementbyid functie werd toegevoegd om op een meer toegankelijke manier elementen aan te kunnen spreken. Evenals

19 het event model om interactie met de gebruiker naar een volgend niveau te kunnen brengen. Ook CSS werd vanaf dit level ondersteund door het DOM. DOM Level 3 In 2004 werd level 3 geïntroduceerd. Hiermee werd onder andere ondersteuning voor xpath toegevoegd, maar ook een interface om het serializen van XML bestanden mogelijk te maken. Dat wil zeggen dat XML bestanden niet alleen ingeladen, maar ook opgeslagen kunnen worden. DOM Level 4 Aan level 4 wordt op dit moment gewerkt.

20 The Browser Object Model Het Browser Object Model stelt JavaScript in staat om met de browser te communiceren. Aangezien moderne browsers vergelijkbare JavaScript methods en properties hebben geïmplementeerd, worden deze gezien als de methods en properties van de BOM. Browser vendors zijn echter vrij in de wijze waarop het BOM wordt geïmplementeerd, in tegenstelling toto het door W3C gestandaardiseerde DOM. Het window object wordt door alle browsers ondersteund en heeft als belangrijkste property het HTML Document Object Model. Alle andere global objects, functies en variables worden gezien als members van de BOM. In principe hoeft het window object niet aangeroepen te worden en dat maakt dat de daarop volgende statements vergelijkbaar zijn. window.document.getelementbyid( element ).writein( blabla ); doet precies hetzelfde als: document.getelementbyid( element ).writein( blabla ); Aangaande bovenstaande tabel zien we dat er naast het DOM nog een aantal andere objecten beschikbaar zijn. Hier volgt een korte beschrijving en mogelijke toepassing van de overige objecten binnen het BOM. Door de objecten te loggen kun je een hoop informatie met betrekking tot de inhoud van deze objecten achterhalen. Document window.document bevat onder andere het HTML DOM. In het volgende hoofdstuk wordt de historie en structuur verder behandeld. Frames Bij het loggen van het window.frames object wordt het window object getoond. Aangezien frames inmiddels deprecated zijn wegens slecht functioneren op het moment dat bezoekers op de pagina kwamen via een zoekmachine (deze frame

21 documents werden los van elkaar geïndexeerd). Ook ontstonden er moeilijkheden op het moment dat pagina s gebookmarked of geprint werden. History window.history geeft toegang tot de history van de browser. Met de methods.back(),.forward() en.go() kun je hierbinnen navigeren. De.go() method dient vergezeld te worden van een parameter, zie het volgende voorbeeld: window.history.go(-2); Bovenstaand statement stuurt de bezoeker naar twee pagina s terug in de browser geschiedenis. Location window.location geeft informatie met betrekking tot je locatie binnen het web. Je kunt bijvoorbeeld de URL in je adresbalk opvragen met behulp van window.location.href. Daarnaast kun je het protocol checken, het eventuele port number en tot slot kun je deze informatie manipuleren met de.replace() method. var protocol = window.location.protocol; var hostname = window.location.hostname; var path = window.location.pathname; var port = window.location.port; var href = protocol + "//" + hostname + port + path; var hreforiginal = window.location.href; window.location.replace(href); //laadt de pagina met deze URL Buiten het bovenstaande kent dit object nog een aantal interessante properties. Zo geeft window.location.referrer je de URL van de voorgaande locatie van de bezoeker. Dit werkt echter alleen als de bezoeker via een link bij het document is gekomen. Wanneer de URL direct in de adresbalk wordt ingevoerd werkt dit niet. Dit kan ook voorkomen worden door de privacy settings van de browser op te voeren. Navigator window.navigator geeft je informatie met betrekking tot het platform waarop de browser draait. Vendor, useragent en version properties zijn hiermee bijvoorbeeld op te vragen. Ook de taalinstellingen kunnen van belang zijn. Op deze wijze kun je, aangaande de standaard instellingen van de bezoeker, achterhalen in welke taal hij

22 of zij de software het liefst voorgeschoteld krijgt. Achter de tweeletter code betreffende de taalinstelling staat nog een tweeletter landcode. var lang = window.navigator.language; //en-us Screen window.screen geeft je informatie over het scherm waarop de browser wordt gedraaid. Zo kunnen we de pixeldepth, height en width opvragen om bijvoorbeeld de uiteindelijke weergave van het document te beïnvloeden.

23 jquery Bestaansrecht In januari 2006 werd de cross-platform JavaScript library jquery gelanceerd. Het doel was om met behulp van deze library het client-side scripting te vereenvoudigen. Tegenwoordig gebruikt zo n 80% van de meest bezochte websites de library en is daarmee de meest populaire JavaScript library. jquery heeft zijn voor en nadelen ten opzichte van pure JavaScript. Deze zal ik hieronder uiteen zetten: Gebruiksvriendelijk De in 2006 gedefinieerde doelstelling duidt ook het grootste voordeel van jquery. De vereenvoudigde JavaScript syntax en enorme hoeveelheid voor gedefinieerde functies stellen de gebruiker in staat om met veel minder regels code een vergelijkbaar resultaat te bewerkstelligen. SEO Waar Flash tegenwoordig bijvoorbeeld op mobile Apple devices niet meer wordt ondersteund is jquery daar een waardige vervanger voor geworden. Bijkomend voordeel is dat, met het gebruik van jquery, de gemanipuleerde HTML in het DOM ook door zoekmachines geïndexeerd kan worden. Dit komt de pagerank van de pagina ten goede en zal de pagina hoger in de zoekmachine resultaten doen laten eindigen. Sterke open-source community Een grote en krachtige open-source community zorgt voor een constante optimalisatie van de library en bestaande plugins. Dit zorgt ervoor dat security en performance issues tijdig getackeld worden op het moment dat deze aan het licht komen. Veel documentatie en tutorials Doordat jquery inmiddels al een tijdje meegaat en het een sterke online community heeft ontwikkeld is de documentatie uiterst verzorgd en zijn er legio tutorials beschikbaar. jquery Syntax De basis jquery syntax luidt als volgt:

Javascript oefenblad 1

Javascript oefenblad 1 Leer de basis van Javascript. Javascript oefenblad 1 Niels van Velzen Javascript oefenblad 1 Pagina 2 Inleiding Javascript is niet altijd even makkelijk. Vooral aan het begin is het even wennen hoe de

Nadere informatie

Variabelen en statements in ActionScript

Variabelen en statements in ActionScript Ontwikkelen van Apps voor ios en Android Variabelen en statements in ActionScript 6.1 Inleiding Als we het in de informatica over variabelen hebben, bedoelen we een stukje in het geheugen van de computer

Nadere informatie

HOOFDSTUK 3. Imperatief programmeren. 3.1 Stapsgewijs programmeren. 3.2 If Then Else. Module 4 Programmeren

HOOFDSTUK 3. Imperatief programmeren. 3.1 Stapsgewijs programmeren. 3.2 If Then Else. Module 4 Programmeren HOOFDSTUK 3 3.1 Stapsgewijs programmeren De programmeertalen die tot nu toe genoemd zijn, zijn imperatieve of procedurele programmeertalen. is het stapsgewijs in code omschrijven wat een programma moet

Nadere informatie

Als een PSD selecties bevat, deelt de lijn van het programma zich op met de verschillende antwoorden op het vraagstuk.

Als een PSD selecties bevat, deelt de lijn van het programma zich op met de verschillende antwoorden op het vraagstuk. HOOFDSTUK 3 3.1 Stapsgewijs programmeren In de vorige hoofdstukken zijn programmeertalen beschreven die imperatief zijn. is het stapsgewijs in code omschrijven wat een programma moet doen, net als een

Nadere informatie

Software 1. php mysql. bachelor grafische en digitale media cross-media ontwerp & grafimediatechnologie academiejaar 2010-2011 semester 1

Software 1. php mysql. bachelor grafische en digitale media cross-media ontwerp & grafimediatechnologie academiejaar 2010-2011 semester 1 Software 1 php mysql bachelor grafische en digitale media cross-media ontwerp & grafimediatechnologie academiejaar 2010-2011 semester 1 Alain Simons alain.simons@artesis.be Basis php 1. Introductie 2.

Nadere informatie

Interactie: Document Object Model en JavaScript. Hoorcollege Webdesign 7 23 mei 2014 Christof van Nimwegen

Interactie: Document Object Model en JavaScript. Hoorcollege Webdesign 7 23 mei 2014 Christof van Nimwegen Interactie: Document Object Model en JavaScript Hoorcollege Webdesign 7 23 mei 2014 Christof van Nimwegen JavaScript WWW was geheel statisch, interactie was alleen volgen van link Javascript maakt interactie

Nadere informatie

Kleine cursus PHP5. Auteur: Raymond Moesker

Kleine cursus PHP5. Auteur: Raymond Moesker Kleine cursus PHP5 Auteur: Raymond Moesker Kleine cursus PHP PHP is platform en CPU onafhankelijk, open source, snel, heeft een grote userbase, het is object georiënteerd, het wordt omarmd door grote bedrijven

Nadere informatie

Websitecursus deel 3 JavaScript

Websitecursus deel 3 JavaScript Websitecursus deel 3 JavaScript A Eskwadraat WebCie www@a-eskwadraat.nl 12 oktober 2015 Introductie Twee weken geleden HTML Vorige week CSS Deze week JavaScript Javascript JavaScript (ook wel JS) is een

Nadere informatie

Programmeren. Cursus Python

Programmeren. Cursus Python Programmeren Cursus Python Cursus Python Omschrijving In deze cursus leren de deelnemers te programmeren in de objectgeoriënteerde programmeertaal Python. Python is een taal die vaak wordt gebruikt voor

Nadere informatie

Vakgroep CW KAHO Sint-Lieven

Vakgroep CW KAHO Sint-Lieven Vakgroep CW KAHO Sint-Lieven Objecten Programmeren voor de Sport: Een inleiding tot JAVA objecten Wetenschapsweek 20 November 2012 Tony Wauters en Tim Vermeulen tony.wauters@kahosl.be en tim.vermeulen@kahosl.be

Nadere informatie

Zelftest Inleiding Programmeren

Zelftest Inleiding Programmeren Zelftest Inleiding Programmeren Document: n0824test.fm 22/01/2013 ABIS Training & Consulting P.O. Box 220 B-3000 Leuven Belgium TRAINING & CONSULTING INLEIDING BIJ DE ZELFTEST INLEIDING PROGRAMMEREN Deze

Nadere informatie

Lab Webdesign: Javascript 7 april 2008

Lab Webdesign: Javascript 7 april 2008 H8: FORMULIEREN In dit hoofdstuk komt het "form"-object aan de orde: we zullen zien hoe we JavaScript kunnen gebruiken voor het manipuleren en valideren van de gegevens die een eindgebruiker invult in

Nadere informatie

VAN HET PROGRAMMEREN. Inleiding

VAN HET PROGRAMMEREN. Inleiding OVERZICHT VAN HET PROGRAMMEREN Inleiding Als je leert programmeren lijkt het nogal overweldigend om die eerste stappen te doorworstelen. Er zijn dan ook heel wat programmeertalen (Java, Ruby, Python, Perl,

Nadere informatie

Les 9: formulier controle met javascript.

Les 9: formulier controle met javascript. Les 9: formulier controle met javascript. Javascript is erg veel gebruikt bij internet toepassingen. In tegenstelling tot PHP, wat een server side scripting is, is java client side scripting. Dwz, niet

Nadere informatie

Sparse columns in SQL server 2008

Sparse columns in SQL server 2008 Sparse columns in SQL server 2008 Object persistentie eenvoudig gemaakt Bert Dingemans, e-mail : info@dla-os.nl www : http:// 1 Content SPARSE COLUMNS IN SQL SERVER 2008... 1 OBJECT PERSISTENTIE EENVOUDIG

Nadere informatie

OEFENINGEN PYTHON REEKS 1

OEFENINGEN PYTHON REEKS 1 Vraag 1: Expressies & Types OEFENINGEN PYTHON REEKS 1 Python maakt gebruik van enkele vaak voorkomende (data)types. Zo zijn er integers die behoren tot de gehele getallen (VB: 3), zijn er float s die behoren

Nadere informatie

Inhoud leereenheid 7c. JavaScript: Objecten en functies. Introductie 59. Leerkern 60. Samenvatting 82. Opdrachten 83. Zelftoets 89.

Inhoud leereenheid 7c. JavaScript: Objecten en functies. Introductie 59. Leerkern 60. Samenvatting 82. Opdrachten 83. Zelftoets 89. Inhoud leereenheid 7c JavaScript: Objecten en functies Introductie 59 Leerkern 60 1 Functies 60 1.1 Syntax - samenvatting 60 1.2 Functies definiëren 61 1.3 Functie als parameter (facultatief) 64 1.4 Functie

Nadere informatie

Selenium IDE Webdriver. Introductie

Selenium IDE Webdriver. Introductie Selenium IDE Webdriver Het Wielsem 10, 5231 BW s- Hertogenbosch, telefoon 073-6409311 e- mail info@testwork.nl internet http://www.testwork.nl 1 Inhoudsopgave 1 Inhoudsopgave... 2 2 Selenium IDE... 3 3

Nadere informatie

4 ASP.NET MVC. 4.1 Controllers

4 ASP.NET MVC. 4.1 Controllers 4 ASP.NET MVC ASP.NET is het.net raamwerk voor het bouwen van webapplicaties. De MVC variant hiervan is speciaal ontworpen voor het bouwen van dergelijke applicaties volgens het Model-View-Controller paradigma.

Nadere informatie

AJAX (XMLHttpRequest)

AJAX (XMLHttpRequest) AJAX (XMLHttpRequest) Ajax is hot. De meesten die met webdesign bezig zijn hebben er wel al van gehoord, veronderstel ik. Voor diegenen die er nog niet van hoorden, of nog niet mee werkten volgt hier een

Nadere informatie

Inhoud. Pagina 2 van 13

Inhoud. Pagina 2 van 13 Code Conventie Inhoud PHP algemeen... 3 Namen van variabelen... 3 Enkele of dubbele aanhalingstekens... 3 Globale variabelen... 3 Namen van functies... 3 Argumenten van functies... 3 Formattering... 4

Nadere informatie

Java. Basissyllabus. Egon Pas

Java. Basissyllabus. Egon Pas Java Basissyllabus Egon Pas 2011 BeanPole bvba Gasmeterlaan 92-9000 Gent BTW BE 472.902.516 Tel: + 32 9 224 42 17 Fax: + 32 9 223 62 88 www.beanpole.be info@beanpole.be 1 Programmeren 1.1 Hoe werkt een

Nadere informatie

Het relaas van de beginnende programmeur. Het hoe en waarom van de assistent

Het relaas van de beginnende programmeur. Het hoe en waarom van de assistent Het relaas van de beginnende programmeur Het hoe en waarom van de assistent 1. Help, mijn code doet niks... Mogelijke oplossingen: Heb je op run geduwd (groene pijltje)? Zolang je niet op 'run' duwt, kent

Nadere informatie

icafe Project Joeri Verdeyen Stefaan De Spiegeleer Ben Naim Tanfous

icafe Project Joeri Verdeyen Stefaan De Spiegeleer Ben Naim Tanfous icafe Project Joeri Verdeyen Stefaan De Spiegeleer Ben Naim Tanfous 2006-2007 Inhoudsopgave 1 2 1.1 Programmeertaal PHP5..................... 2 1.2 MySQL database......................... 3 1.3 Adobe Flash...........................

Nadere informatie

Externe pagina s integreren in InSite en OutSite

Externe pagina s integreren in InSite en OutSite Externe pagina s integreren in InSite en OutSite Document-versie: 1.1 Datum: 04-10-2013 2013 AFAS Software Leusden Niets uit deze uitgave mag verveelvoudigd worden en/of openbaar gemaakt worden door middel

Nadere informatie

Inhoud. Introductie tot de cursus

Inhoud. Introductie tot de cursus Inhoud Introductie tot de cursus 1 De functie van de cursus 7 2 De inhoud van de cursus 7 2.1 Voorkennis 7 2.2 Leerdoelen van de cursus 8 2.3 Opbouw van de cursus 8 3 Leermiddelen en wijze van studeren

Nadere informatie

Programmeren: Visual Basic

Programmeren: Visual Basic PETERSTUYVESANT COLLEGE INFORMATICA 2009-2010 Programmeren: Visual Basic Algemene Kennis: 01. Programmeren Programmeren is het schrijven van een computerprogramma, een concrete verzameling instructies

Nadere informatie

Technisch ontwerp. Projectteam 6. Project "Web Essentials" 02 april 2009. Versie 2.1.0

Technisch ontwerp. Projectteam 6. Project Web Essentials 02 april 2009. Versie 2.1.0 Projectteam 6 Faculteit Natuur en Techniek Hogeschool Utrecht Projectleider: Hans Allis, hans.allis@student.hu.nl Technisch ontwerp Project "Web Essentials" 02 april 2009 Versie 2.1.0 Teamleden: Armin

Nadere informatie

Dynamiek met VO-Script

Dynamiek met VO-Script Dynamiek met VO-Script Door Bert Dingemans DLA Ontwerp & Software bert@dla-architect.nl Inleiding Op de SDGN nieuwsgroep voor Visual Objects ontstond laatst een draad van berichten over de nieuwe libraries

Nadere informatie

Cerium CMS versie 4.0. Wat is nieuw in versie 4.0. www.cerium.nl

Cerium CMS versie 4.0. Wat is nieuw in versie 4.0. www.cerium.nl Cerium CMS versie 4.0 Wat is nieuw in versie 4.0 www.cerium.nl Bijgewerkt februari 2014 Cerium BV 2014 Inhoudsopgave 1. Inleiding 3 2. Nieuwe onderhouds URL 4 3. Drag and drop upload 5 4. Spring naar item

Nadere informatie

Syntax- (compile), runtime- en logische fouten Binaire operatoren

Syntax- (compile), runtime- en logische fouten Binaire operatoren Inhoud Syntax- (compile), runtime- en logische fouten Binaire operatoren Operaties op numerieke datatypen Evaluatie van expressies, bindingssterkte Assignment operaties en short-cut operatoren Controle

Nadere informatie

Lab Webdesign: Javascript 11 februari 2008

Lab Webdesign: Javascript 11 februari 2008 H2: BASISBEGRIPPEN In dit hoofdstuk zullen er enkele basisbegrippen worden behandelt PLAATSING VAN JAVASCRIPT-CODE DE SCRIPT-TAG De script-tag geeft aan dat er gebruik zal worden gemaakt van een scripttaal.

Nadere informatie

GoogleMapsGoogleMapsGoogleMaps GoogleMapsGoogleMapsGoogleMaps GoogleMapsGoogleMapsGoogleMaps

GoogleMapsGoogleMapsGoogleMaps GoogleMapsGoogleMapsGoogleMaps GoogleMapsGoogleMapsGoogleMaps Google Maps INHOUDSOPGAVE Inleiding.. 3 Een Google Map maken.. 4 Een eigen adres opgeven 7 Inzoomen op je eigenkaart. 8 Satellietbeeld op je eigenkaart. 10 Markers plaatsen. 13 Tekstballon plaatsen.. 15

Nadere informatie

Formulieren maken met Dreamweaver CS 4/CS 5

Formulieren maken met Dreamweaver CS 4/CS 5 Formulieren maken met Dreamweaver CS 4/CS 5 In deze handleiding leer je om een formulier en elementen die je binnen een formulier kunt gebruiken, te ontwerpen met Dreamweaver. Het uitgangspunt is dat dit

Nadere informatie

Inleiding Visual Basic en VBA. Karel Nijs 2009/01

Inleiding Visual Basic en VBA. Karel Nijs 2009/01 Inleiding Visual Basic en VBA Karel Nijs 2009/01 Leswijze Eerst wat theorie Begeleid met (korte) oefeningen Ms Excel 2003 Online hulp: http://www.ozgrid.com/vba/ http://msdn.microsoft.com/en-us/library/sh9ywfdk(vs.80).aspx

Nadere informatie

SQL manipulatietaal. We kunnen er data mee toevoegen, wijzigen en verwijderen uit een database.

SQL manipulatietaal. We kunnen er data mee toevoegen, wijzigen en verwijderen uit een database. SQL manipulatietaal We kunnen er data mee toevoegen, wijzigen en verwijderen uit een database. Basiscommando's: INSERT : toevoegen van gegevens DELETE : verwijderen van gegevens UPDATE : wijzigen van gegevens

Nadere informatie

http://www.liacs.nl/home/kosters/java/

http://www.liacs.nl/home/kosters/java/ sheets Programmeren 1 Java college 2, Walter Kosters De sheets zijn gebaseerd op de hoofdstukken 2 tot en met 6 van: D. Bell en M. Parr, Java voor studenten, Prentice Hall, 2002 http://www.liacs.nl/home/kosters/java/

Nadere informatie

Fun met webparts in ASP.Net

Fun met webparts in ASP.Net Fun met webparts in ASP.Net Deel 2:User controls en Webparts door Bert Dingemans, e-mail : info@dla-os.nl www : http:// 1 Inhoudsopgave FUN MET WEBPARTS IN ASP.NET... 1 DEEL 2:USER CONTROLS EN WEBPARTS...

Nadere informatie

Software Design Document

Software Design Document Software Design Document Mathieu Reymond, Arno Moonens December 2014 Inhoudsopgave 1 Versiegeschiedenis 2 2 Definities 3 3 Introductie 4 3.1 Doel en Scope............................. 4 4 Logica 5 4.1

Nadere informatie

Dynamische websites met PHP (basis) Karel Nijs 2010/09

Dynamische websites met PHP (basis) Karel Nijs 2010/09 Dynamische websites met PHP (basis) Karel Nijs 2010/09 Leswijze Eerst wat theorie Begeleid met (korte) oefeningen Editor = UltraEdit Geen DreamWeaver Browser = Internet Explorer Vereiste voorkennis: (X)HTML

Nadere informatie

start -> id (k (f c s) (g s c)) -> k (f c s) (g s c) -> f c s -> s c

start -> id (k (f c s) (g s c)) -> k (f c s) (g s c) -> f c s -> s c Een Minimaal Formalisme om te Programmeren We hebben gezien dat Turing machines beschouwd kunnen worden als universele computers. D.w.z. dat iedere berekening met natuurlijke getallen die met een computer

Nadere informatie

Programmeerstructuren met App Inventor

Programmeerstructuren met App Inventor Programmeerstructuren met App Inventor Kevin Krul, Universiteit Utrecht Roncalli, Bergen op Zoom Inhoud: Les 1: Introductie tot App Inventor, when statement en variabelen. Les 2: Introductie if-statement

Nadere informatie

Iedere ontwikkelaar die met ASP.NET AJAX heeft gewerkt, is

Iedere ontwikkelaar die met ASP.NET AJAX heeft gewerkt, is Dennis van de Laar ASP.NET AJAX-control bouwen VO L L E D I G E V R I J H E I D E N C O N T RO L E OV E R D E A S Y N C H RO N E COMMUNICATIE VAN EEN WEBPAGINA De meeste.net-developers zijn bekend met

Nadere informatie

Programmeren in Java les 3

Programmeren in Java les 3 4 september 2015 Deze les korte herhaling vorige week loops methodes Variabelen Soorten variabelen in Java: integer: een geheel getal, bijv. 1,2,3,4 float: een gebroken getal, bijv. 3.1415 double: een

Nadere informatie

HvA Instituut voor Interactieve Media ActionScript 3.0

HvA Instituut voor Interactieve Media ActionScript 3.0 PPRO 1: OEFENINGEN LES 1 Hierbij de werkgroepoefeningen behorend bij het practicum week 1. Lees de stukken uitleg aandachtig door, zonder deze informatie zullen de principes in de oefeningen moeilijk te

Nadere informatie

Knowledgeable Referenceable Personable Accountable Scalable

Knowledgeable Referenceable Personable Accountable Scalable Knowledgeable Referenceable Personable Accountable Scalable 1 WebForms en JavaBeans bij Essent Energie OGH presentatie 3 juli 2003 2 Agenda Inleiding Eenvoudige Java Bean in Web Forms Demo Meer complexe

Nadere informatie

DELPHI VOOR ELEKTRONICI. Deel 2: Een rekenmachine programmeren CURSUS

DELPHI VOOR ELEKTRONICI. Deel 2: Een rekenmachine programmeren CURSUS DELPHI VOOR ELEKTRONICI CURSUS Deel 2: Een rekenmachine programmeren Herman Bulle met dank aan Anton Vogelaar In het vorige artikel hebben we de programmeeromgeving van Delphi geïntroduceerd en zijn er

Nadere informatie

Lab Webdesign: Javascript 11 februari 2008

Lab Webdesign: Javascript 11 februari 2008 H3: HERHALINGSLUSSEN EN LOGICA Om de voorbeelden niet nodeloos lang te maken, zullen we in het vervolg niet altijd de SCRIPT-tags en de HTML-commentaarregels herhalen. Om de JavaScript-opdrachten --de

Nadere informatie

1 Inleiding in Functioneel Programmeren

1 Inleiding in Functioneel Programmeren 1 Inleiding in Functioneel Programmeren door Elroy Jumpertz 1.1 Inleiding Aangezien Informatica een populaire minor is voor wiskundestudenten, leek het mij nuttig om een stukje te schrijven over een onderwerp

Nadere informatie

HTML Graphics. Hans Roeyen V 3.0

HTML Graphics. Hans Roeyen V 3.0 HTML Graphics Hans Roeyen V 3.0 19 maart 2015 Inhoud 1. HTML5 Canvas... 3 1.1. Het Canvas element... 3 2. SVG Element... 9 2.1. SVG vergeleken met Canvas... 9 2.2. Een cirkel tekenen met SVG... 10 2.2.1.

Nadere informatie

Web building gevorderden: CSS & JavaScript. Karel Nijs 2008/11

Web building gevorderden: CSS & JavaScript. Karel Nijs 2008/11 Web building gevorderden: CSS & JavaScript Karel Nijs 2008/11 Webbuilding gevorderden les 3 JavaScript intro JavaScript invoegen JavaScript statements JavaScript popup berichten JavaScript functies JavaScript

Nadere informatie

Globale kennismaking

Globale kennismaking Globale kennismaking Kennismaking Tesla CMS 1. Dashboard 2. pagina beheer - pagina aanmaken - pagina aanpassen - pagina verwijderen - pagina seo opties - zichtbaarheid pagina 3. subpagina beheer - subpagina

Nadere informatie

Eigen Widgets in CRM. Introductie. Limitering. Widgets beschikbaar stellen. Tips & Tricks Eigen Widgets in CRM

Eigen Widgets in CRM. Introductie. Limitering. Widgets beschikbaar stellen. Tips & Tricks Eigen Widgets in CRM Tips & Tricks Eigen Widgets in CRM Eigen Widgets in CRM Introductie De WebUI van CRM 7.0 maakt het mogelijk om je eigen widgets te maken en deze in je eigen view te gebruiken. Dat kan door gebruik te maken

Nadere informatie

Inhoud leereenheid 4. Inleiding JavaScript. Introductie 99. Leerkern 100. Zelftoets 108. Terugkoppeling 109

Inhoud leereenheid 4. Inleiding JavaScript. Introductie 99. Leerkern 100. Zelftoets 108. Terugkoppeling 109 Inhoud leereenheid 4 Inleiding JavaScript Introductie 99 Leerkern 100 1 Leren programmeren in JavaScript 100 2 Chapter 1: Introduction 101 3 Chapter 2, paragrafen 1 t/m 5 102 4 Chapter 2, paragrafen 6

Nadere informatie

Website beoordeling zonetelechargement.com

Website beoordeling zonetelechargement.com Website beoordeling zonetelechargement.com Gegenereerd op Juli 23 2015 10:12 AM De score is 47/100 SEO Content Title zone-telechargement.com 520: Web server is returning an unknown error Lengte : 71 Let

Nadere informatie

Programmeren met Arduino-software

Programmeren met Arduino-software Programmeren met Arduino-software De software waarin we programmeren is Arduino IDE. Deze software is te downloaden via www.arduino.cc. De programmeertaal die hier gebruikt wordt, is gebaseerd op C en

Nadere informatie

ASRemote WebService. Via deze webservice kunt u:

ASRemote WebService. Via deze webservice kunt u: ASRemote WebService De ASRemote WebService is een SOAP Webservice die softwarematige communicatie met Exact Globe mogelijk maakt vanaf een willekeurige locatie op het internet. Via deze webservice kunt

Nadere informatie

Voor vragen: http://www.richard3332.nl/ of mail naar Richard3332@gmail.com

Voor vragen: http://www.richard3332.nl/ of mail naar Richard3332@gmail.com Welkom bij mijn PHP tutorial (Deel 1) Ik ga in deze delen PHP uitleggen, dit doe ik in het programma notepad++ (gratis) deze kunt u downloaden van www.richard3332.nl/downloads.php Als u beschikt over dreamweaver

Nadere informatie

Datatypes Een datatype is de sort van van een waarde van een variabele, veel gebruikte datatypes zijn: String, int, Bool, char en double.

Datatypes Een datatype is de sort van van een waarde van een variabele, veel gebruikte datatypes zijn: String, int, Bool, char en double. Algemeen C# Variabele Een variabele is een willekeurige waarde die word opgeslagen. Een variabele heeft altijd een datetype ( De soort waarde die een variabele bevat). Datatypes Een datatype is de sort

Nadere informatie

Info-books. Toegepaste Informatica. Deel 35: XML - XSL HO35. Jos Gils Erik Goossens

Info-books. Toegepaste Informatica. Deel 35: XML - XSL HO35. Jos Gils Erik Goossens Info-books HO35 Toegepaste Informatica Deel 35: XML - XSL Jos Gils Erik Goossens Hoofdstuk 5 Het Document Object Model 5.1 Probleemstelling Wanneer je de inhoud van een document en de presentatie uiteen

Nadere informatie

DrICTVoip.dll v 2.1 Informatie en handleiding

DrICTVoip.dll v 2.1 Informatie en handleiding DrICTVoip.dll v 2.1 Informatie en handleiding Nieuw in deze versie : Koppeling voor web gebaseerde toepassingen (DrICTVoIPwebClient.exe) (zie hoofdstuk 8) 1. Inleiding Met de DrICTVoIP.DLL maakt u uw software

Nadere informatie

Titel: flashvars.html

Titel: flashvars.html Data uitwisselen met Flash: the easiest way Kris Merckx www.ardeco.be Macromedia Flash-bestanden kunnen opgenomen worden in HTML. Een Flashfilm (*.swf) kan tekst, afbeeldingen, film, geluid en vectorbeelden

Nadere informatie

JavaScript for Interactive Web Pages 2

JavaScript for Interactive Web Pages 2 Leereenheid 7b JavaScript for Interactive Web Pages 2 I N T R O D U C T I E In de vorige leereenheid heeft u kennisgemaakt met JavaScript, en heeft u geleerd om eenvoudige event handlers te schrijven.

Nadere informatie

Uitleg: In de bovenstaande oefening zie je in het eerste blokje een LEES en een SCHRIJF opdracht. Dit is nog lesstof uit het tweede trimester.

Uitleg: In de bovenstaande oefening zie je in het eerste blokje een LEES en een SCHRIJF opdracht. Dit is nog lesstof uit het tweede trimester. In onderstaande oefeningen zijn kleuren gebruikt. Deze dienen aleen om de structuren makkelijker terug te kunnen herkennen. Ze worden niet standaard zo gebruikt. De dunne rood/roze balken zijn ook geen

Nadere informatie

Inhoud leereenheid 7a. JavaScript for Interactive Web Pages 1. Introductie 9. Leerkern 10. Samenvatting 19. Opdrachten 20.

Inhoud leereenheid 7a. JavaScript for Interactive Web Pages 1. Introductie 9. Leerkern 10. Samenvatting 19. Opdrachten 20. Inhoud leereenheid 7a JavaScript for Interactive Web Pages 1 Introductie 9 Leerkern 10 7.1 Key JavaScript Concepts 10 7.1.1 Client-Side Scripting 10 7.1.2 Event-Driven Programming 11 7.1.3 A JavaScript

Nadere informatie

Introductie testtooling Wink

Introductie testtooling Wink Introductie testtooling Wink SYSQA B.V. Almere Datum : 10-04-2013 Status : 1.0 Opgesteld door : Organisatie SYSQA B.V. Pagina 2 van 16 Inhoudsopgave 1 Inleiding... 3 1.1 Opbouw... 3 2 Wink... 4 2.1 Wat

Nadere informatie

icafe Een digitaal bestelsysteem voor de horeca Joeri Verdeyen Stefaan De Spiegeleer Naim Ben Tanfous

icafe Een digitaal bestelsysteem voor de horeca Joeri Verdeyen Stefaan De Spiegeleer Naim Ben Tanfous icafe Een digitaal bestelsysteem voor de horeca Joeri Verdeyen Stefaan De Spiegeleer Naim Ben Tanfous 2006-2007 Voorwoord 1 Inhoudsopgave 2 Hoofdstuk 1 Inleiding 3 Hoofdstuk 2 icafe 2.1 Het idee 2.2 Mogelijkheden

Nadere informatie

Voordelen: Nadelen: Benodigdheden: Programma s: Google Web Designer. Photoshop. Sublime (HTML-editor) Websites: Tinypng.com

Voordelen: Nadelen: Benodigdheden: Programma s: Google Web Designer. Photoshop. Sublime (HTML-editor) Websites: Tinypng.com Google Web Designer Voordelen: Sneller en makkelijker. Banners kunnen worden afgespeeld op telefoons (flash kan dit niet). Het vervangen van plaatjes kan zonder het programma op te starten. Meer FPS dan

Nadere informatie

Abstraheren van modellen

Abstraheren van modellen Abstraheren van modellen Geert Delanote 7 maart 2005 Geert.Delanote@cs.kuleuven.ac.be Software Development Methodology 1 Inhoudstafel Motivatie Denkpistes Software Development Methodology 2 Motivatie Verslag

Nadere informatie

Naam stagiair: Nick Swaerdens. Klas: 3IV2. Praktijkopleider: Jordy Pouw. Stagebegeleider: Ron Spitse. Stage periode tweede verslag:

Naam stagiair: Nick Swaerdens. Klas: 3IV2. Praktijkopleider: Jordy Pouw. Stagebegeleider: Ron Spitse. Stage periode tweede verslag: Nick Swaerdens 3IV2 10 / 06 / 2015 Naam stagiair: Nick Swaerdens Klas: 3IV2 Praktijkopleider: Jordy Pouw Stagebegeleider: Ron Spitse Stage periode tweede verslag: 2 april 2015 10 juni 2015 Inlever datum:

Nadere informatie

Handleiding RS Form! 1.0.4

Handleiding RS Form! 1.0.4 Handleiding RS Form! 1.0.4 Inhoud 1. Controlepaneel... 3 2. Forms Manager... 4 2.1 Nieuwe form aanmaken... 4 2.2 Nieuwe fields toevoegen... 7 2.3 Wijzigen/verwijderen bestaande Forms, Fields... 10 Versie

Nadere informatie

Universiteit van Amsterdam FNWI. Voorbeeld van tussentoets Inleiding programmeren

Universiteit van Amsterdam FNWI. Voorbeeld van tussentoets Inleiding programmeren Universiteit van Amsterdam FNWI Voorbeeld van tussentoets Inleiding programmeren Opgave 1: Wat is de uitvoer van dit programma? public class Opgave { static int i = 0 ; static int j = 1 ; int i = 1 ; int

Nadere informatie

van PSD naar JavaScript

van PSD naar JavaScript 2015 van PSD naar JavaScript F. Vonk versie 2 19-9-2015 inhoudsopgave 1. inleiding... - 2-2. ontwikkelomgeving... - 3-3. programmeerconcepten... - 4 - statement... - 4 - sequentie... - 4 - variabele en

Nadere informatie

Documentatie LiveMaster integratie

Documentatie LiveMaster integratie Documentatie LiveMaster integratie Snel en gemakkelijk Liveshow voor jouw bezoekers Pagina: 1 Inleiding Wilt u de performers van LiveMaster aanbieden aan uw bezoekers, volg dan de stappen in deze handleiding

Nadere informatie

Organiseer uw verschillende SOAP services in één scenario

Organiseer uw verschillende SOAP services in één scenario 1 Organiseer uw verschillende SOAP services in één scenario Wouter Luijten wouterluijten@creetion.com 2 Introductie Tijdens de implementatie van een proces heeft u vaak te maken met een veelvoud aan services.

Nadere informatie

Technische specificaties Tracking & Tracing

Technische specificaties Tracking & Tracing Netherlands B.V. Technische specificaties Tracking & Tracing Copyright 2006 GLS Netherlands B.V. Versie 052006 1.5 1 Inleiding... 3 Technische uitwerking... 4 Berekening CHK-component... 5 Voorbeelden...

Nadere informatie

Zicht - Content Management Systeem een algemene beschrijving

Zicht - Content Management Systeem een algemene beschrijving Zicht - Content Management Systeem een algemene beschrijving Versie april/2008 Zicht nieuwe media ontwerpers 2008 1 Inleiding Een Content Management Systeem (CMS) is een webapplicatie waarmee je zonder

Nadere informatie

Gegevens invullen in HOOFDLETTERS en LEESBAAR, aub. Belgische Olympiades in de Informatica (duur : maximum 1u15 )

Gegevens invullen in HOOFDLETTERS en LEESBAAR, aub. Belgische Olympiades in de Informatica (duur : maximum 1u15 ) OI 2010 Finale 12 Mei 2010 Gegevens invullen in HOOFDLETTERS en LEESBAAR, aub VOORNAAM :....................................................... NAAM :..............................................................

Nadere informatie

SEO IS SIMPEL SEARCH ENGINE OPTIMIZATION E-BOOK

SEO IS SIMPEL SEARCH ENGINE OPTIMIZATION E-BOOK SEARCH ENGINE OPTIMIZATION E-BOOK VERSIE: 1.0 DATUM: APRIL 2009 AUTEUR: ERWIN SIGTERMAN WEBSITE: WWW.SIGGYVOLGT.NL E-MAIL: ERWIN@SIGTERMAN.COM INHOUDSOPGAVE 1 Search engine optimalization... 3 URL aanmelden

Nadere informatie

Dynamische webapplicaties in Java

Dynamische webapplicaties in Java Dynamische webapplicaties in Java October 7, 2006 In java is het mogelijk dynamische webpagina s te implementeren. De code om de dynamische gegevens te genereren staat in servlets of Java Server Pages

Nadere informatie

Perceptive Process. Release Notes. Version: 3.5.x

Perceptive Process. Release Notes. Version: 3.5.x Perceptive Process Release Notes Version: 3.5.x Written by: Product Knowledge, R&D Date: December 2015 2015 Lexmark International Technology, S.A. All rights reserved. Lexmark is a trademark of Lexmark

Nadere informatie

Een eenvoudig algoritme om permutaties te genereren

Een eenvoudig algoritme om permutaties te genereren Een eenvoudig algoritme om permutaties te genereren Daniel von Asmuth Inleiding Er zijn in de vakliteratuur verschillende manieren beschreven om alle permutaties van een verzameling te generen. De methoden

Nadere informatie

Summa Cutter Tools. 1 Cutter tools. Met dit programma kunnen twee dingen geïnstalleerd worden:

Summa Cutter Tools. 1 Cutter tools. Met dit programma kunnen twee dingen geïnstalleerd worden: Summa Cutter Tools 1 Cutter tools Met dit programma kunnen twee dingen geïnstalleerd worden: 1. Plug-in voor Corel (vanaf versie 11) en Adobe Illustrator (vanaf versie CS). De plug-in voor Corel installeert

Nadere informatie

Klassen & objecten, overerving, abstracte klassen, debuggen, interfaces, formulieren, polymorfie, statische methoden, event-handlers

Klassen & objecten, overerving, abstracte klassen, debuggen, interfaces, formulieren, polymorfie, statische methoden, event-handlers 1 Inhoud Klassen & objecten, overerving, abstracte klassen, debuggen, interfaces, formulieren, polymorfie, statische methoden, event-handlers 2 Geluidsbronnen simulator, deel 2 Inleiding De weergave versnellen

Nadere informatie

Voorwoord 1. Voorwoord

Voorwoord 1. Voorwoord Voorwoord 1 Voorwoord Naar aanleiding van vele PHP gerelateerde vragen en het ontbreken van een duidelijke on line Nederlandse beginnershandleiding, heb ik in december 2007 besloten om zo n handleiding

Nadere informatie

Angular Best Practices Door Alex en Chris van Beek

Angular Best Practices Door Alex en Chris van Beek Angular Best Practices Door Alex en Chris van Beek Over ons Enthousiastelingen Software Architecten bij Luminis Arnhem B.V. Gespecialiseerd in Microsoft technologie:.net, Azure en Windows Twitter: @Beekje

Nadere informatie

Project plan. Erwin Hannaart Sander Tegelaar 61849 62407

Project plan. Erwin Hannaart Sander Tegelaar 61849 62407 Project plan Erwin Hannaart Sander Tegelaar 61849 62407 I4C2 I4C1 1 Inhoudsopgave Doel en doelgroep van het project... 3 Beschrijving van het project... 4 Benodigde materialen... 5 Te verwachten resultaten,

Nadere informatie

Kennismaken Greenfoot

Kennismaken Greenfoot HOOFDSTUK 1 Kennismaken met Greenfoot onderwerpen: de interface van Greenfoot, omgaan met objecten, methodes aanroepen, een scenario uitvoeren concepten: object, klasse, methode-aanroep, parameter, retourwaarde

Nadere informatie

Drempelvrij samenwerken

Drempelvrij samenwerken Drempelvrij samenwerken Start ook met drempelvrij samenwerken. Door kennis en informatie te delen op een platform dat aan de webrichtlijnen voldoet kun je met heel Nederland samenwerken. In deze whitepaper

Nadere informatie

ContentQueryWebpart en custom XSLT. Alles wat je moet weten over het CQW

ContentQueryWebpart en custom XSLT. Alles wat je moet weten over het CQW ContentQueryWebpart en custom XSLT Alles wat je moet weten over het CQW 1 Contents Voorkennis... 3 Het CQW volgens Microsoft... 3 Algemene werking van het CQW... 3 Het werken met slots... 4 DataMappings...

Nadere informatie

01/05. Websites Nederland over. Mobile marketing. Whitepaper #03/2013. Mabelie Samuels internet marketeer

01/05. Websites Nederland over. Mobile marketing. Whitepaper #03/2013. Mabelie Samuels internet marketeer 01/05 Websites Nederland over Mobile marketing Mabelie Samuels internet marketeer 02/05 Mobile marketing Kunt u zich uw eerste mobiele telefoon nog herinneren? Die van mij was een Motorola, versie onbekend,

Nadere informatie

1.Noem de vijf categorieën waarin programmeertalen kunnen worden ingedeeld en geef van elke categorie één voorbeeld.

1.Noem de vijf categorieën waarin programmeertalen kunnen worden ingedeeld en geef van elke categorie één voorbeeld. Module 4 programmeren 1.Noem de vijf categorieën waarin programmeertalen kunnen worden ingedeeld en geef van elke categorie één voorbeeld. Machinecode Assembleertalen: assembly Hogere programmeertalen:

Nadere informatie

Zoekmachine Optimalisatie (SEO)

Zoekmachine Optimalisatie (SEO) Zoekmachine Optimalisatie (SEO) Dit ebook wordt u geheel gratis aangeboden door Usense - Dé Online Marketing Specialist. Zoekmachine Optimalisatie Zoekmachine optimalisatie, oftewel SEO, gaat over het

Nadere informatie

Scratch voor mobiel: AppInventor

Scratch voor mobiel: AppInventor Scratch voor mobiel: AppInventor Beginnen AppInventor is Scratch voor Android. Je maakt hiermee apps voor op je mobiele telefoon of tablet. Beginnen: Start chrome.exe en ga naar http://appinventor.mit.edu/explore

Nadere informatie

Les F-02 UML. 2013, David Lans

Les F-02 UML. 2013, David Lans Les F-02 UML In deze lesbrief wordt globaal beschreven wat Unified Modeling Language (UML) inhoudt. UML is een modelleertaal. Dat wil zeggen dat je daarmee de objecten binnen een (informatie)systeem modelmatig

Nadere informatie

In deze PDF zal er vanuit worden gegaan dat je weet wat HTML is en dat je weet hoe je een website aan moet passen in de code.

In deze PDF zal er vanuit worden gegaan dat je weet wat HTML is en dat je weet hoe je een website aan moet passen in de code. Bedankt! Als eerste bedankt voor het aanschaffen van deze PDF waarin ik je handige tips en trucs zal geven voor de optimalisatie van jouw website. Deze PDF staat vol met informatie om de website te kunnen

Nadere informatie

NOTITIE. Vragen gebruikersgroep

NOTITIE. Vragen gebruikersgroep NOTITIE [van] Edward Diemel [voor] Swing gebruikersgroep [kenmerk] n2013-0081ed [plaats] Delft [project] 13057-SWG [datum] 19 maart 2013 [onderwerp] Swing gebruikersdag 19-03-2013 Op 19 maart 2013 heeft

Nadere informatie

HANDLEIDING DOIT BEHEER SYSTEEM

HANDLEIDING DOIT BEHEER SYSTEEM HANDLEIDING DOIT BEHEER SYSTEEM ALGEMENE INFORMATIE Het Doit beheer systeem is een modulair opgebouwd systeem waarin modules makkelijk kunnen worden toegevoegd of aangepast, niet iedere gebruiker zal dezelfde

Nadere informatie

Lekker snel XML met SQL (.nl)

Lekker snel XML met SQL (.nl) Lekker snel met SQL (.nl In steeds meer opdrachten kom je als requirement tegen. Omdat het lekker makkelijk is of omdat de interface die je moet aanspreken het vereist. Dit is zeker het geval wanneer je

Nadere informatie

SQL datadefinitietaal

SQL datadefinitietaal SQL datadefinitietaal We kunnen er het schema van de database mee bepalen: metadata toevoegen, wijzigen en verwijderen uit een database. Basiscommando's: CREATE : toevoegen van metagegevens DROP : verwijderen

Nadere informatie