codepreneur week3 - introduction to javascript
TRANSCRIPT
![Page 1: CodePreneur Week3 - Introduction to JavaScript](https://reader033.vdocuments.us/reader033/viewer/2022051706/58efd0331a28abef048b456d/html5/thumbnails/1.jpg)
Holla!
![Page 2: CodePreneur Week3 - Introduction to JavaScript](https://reader033.vdocuments.us/reader033/viewer/2022051706/58efd0331a28abef048b456d/html5/thumbnails/2.jpg)
This is Codepreneur2016
![Page 4: CodePreneur Week3 - Introduction to JavaScript](https://reader033.vdocuments.us/reader033/viewer/2022051706/58efd0331a28abef048b456d/html5/thumbnails/4.jpg)
Last week, we learned CSS, remember?
![Page 5: CodePreneur Week3 - Introduction to JavaScript](https://reader033.vdocuments.us/reader033/viewer/2022051706/58efd0331a28abef048b456d/html5/thumbnails/5.jpg)
Exercisedesign a webpage with external css
![Page 6: CodePreneur Week3 - Introduction to JavaScript](https://reader033.vdocuments.us/reader033/viewer/2022051706/58efd0331a28abef048b456d/html5/thumbnails/6.jpg)
Week 3.Scripts, Oil And Moving parts
![Page 7: CodePreneur Week3 - Introduction to JavaScript](https://reader033.vdocuments.us/reader033/viewer/2022051706/58efd0331a28abef048b456d/html5/thumbnails/7.jpg)
Javascriptbringing life to webpages since 1995
![Page 8: CodePreneur Week3 - Introduction to JavaScript](https://reader033.vdocuments.us/reader033/viewer/2022051706/58efd0331a28abef048b456d/html5/thumbnails/8.jpg)
MEET JAVASCRIPTYou clicked and it happened! Javascript is the programming language of HTML and the Web.
![Page 9: CodePreneur Week3 - Introduction to JavaScript](https://reader033.vdocuments.us/reader033/viewer/2022051706/58efd0331a28abef048b456d/html5/thumbnails/9.jpg)
BETTER USER EXPERIENCEJS makes your webpage respond interactively to the user
![Page 10: CodePreneur Week3 - Introduction to JavaScript](https://reader033.vdocuments.us/reader033/viewer/2022051706/58efd0331a28abef048b456d/html5/thumbnails/10.jpg)
<script>JS on your HTML page lives within the <script></script> tags
![Page 11: CodePreneur Week3 - Introduction to JavaScript](https://reader033.vdocuments.us/reader033/viewer/2022051706/58efd0331a28abef048b456d/html5/thumbnails/11.jpg)
LIVES ANYWHERE, REALLY<script> tags can show up anywhere – in the head or body section
![Page 12: CodePreneur Week3 - Introduction to JavaScript](https://reader033.vdocuments.us/reader033/viewer/2022051706/58efd0331a28abef048b456d/html5/thumbnails/12.jpg)
<script src>You link up with external JS file via the same <script> but pointing the src attribute to the file
![Page 13: CodePreneur Week3 - Introduction to JavaScript](https://reader033.vdocuments.us/reader033/viewer/2022051706/58efd0331a28abef048b456d/html5/thumbnails/13.jpg)
JS Output.alert, doc.write, innerHTML, console
![Page 14: CodePreneur Week3 - Introduction to JavaScript](https://reader033.vdocuments.us/reader033/viewer/2022051706/58efd0331a28abef048b456d/html5/thumbnails/14.jpg)
DOM
![Page 15: CodePreneur Week3 - Introduction to JavaScript](https://reader033.vdocuments.us/reader033/viewer/2022051706/58efd0331a28abef048b456d/html5/thumbnails/15.jpg)
DOCUMENT OBJECT MODELThis is how JS is able to access and change elements in an HTML document
![Page 16: CodePreneur Week3 - Introduction to JavaScript](https://reader033.vdocuments.us/reader033/viewer/2022051706/58efd0331a28abef048b456d/html5/thumbnails/16.jpg)
DOM documentThat’s your webpage, JS represents it simply as document
![Page 17: CodePreneur Week3 - Introduction to JavaScript](https://reader033.vdocuments.us/reader033/viewer/2022051706/58efd0331a28abef048b456d/html5/thumbnails/17.jpg)
Finding stuff.By: ID, Tag name, Class name
![Page 18: CodePreneur Week3 - Introduction to JavaScript](https://reader033.vdocuments.us/reader033/viewer/2022051706/58efd0331a28abef048b456d/html5/thumbnails/18.jpg)
Elements..innerHTML, .attribute,
.setAttribute, .style.property
![Page 19: CodePreneur Week3 - Introduction to JavaScript](https://reader033.vdocuments.us/reader033/viewer/2022051706/58efd0331a28abef048b456d/html5/thumbnails/19.jpg)
Functions
![Page 20: CodePreneur Week3 - Introduction to JavaScript](https://reader033.vdocuments.us/reader033/viewer/2022051706/58efd0331a28abef048b456d/html5/thumbnails/20.jpg)
function()Functions are smart ways of achieving things in JS. They’re reusable.
![Page 21: CodePreneur Week3 - Introduction to JavaScript](https://reader033.vdocuments.us/reader033/viewer/2022051706/58efd0331a28abef048b456d/html5/thumbnails/21.jpg)
NOTEJavaScript is case-sensitive, so nest is not the same as Nest
![Page 22: CodePreneur Week3 - Introduction to JavaScript](https://reader033.vdocuments.us/reader033/viewer/2022051706/58efd0331a28abef048b456d/html5/thumbnails/22.jpg)
Timers.interval, timeout
![Page 23: CodePreneur Week3 - Introduction to JavaScript](https://reader033.vdocuments.us/reader033/viewer/2022051706/58efd0331a28abef048b456d/html5/thumbnails/23.jpg)
Events.when something happens…
![Page 24: CodePreneur Week3 - Introduction to JavaScript](https://reader033.vdocuments.us/reader033/viewer/2022051706/58efd0331a28abef048b456d/html5/thumbnails/24.jpg)
Aim, Fire!!!Events are things that happen to HTML elements, JS reacts to these events
![Page 25: CodePreneur Week3 - Introduction to JavaScript](https://reader033.vdocuments.us/reader033/viewer/2022051706/58efd0331a28abef048b456d/html5/thumbnails/25.jpg)
What to do with an eventYou handle them with event handlers (which are actually just functions [code blocks])
![Page 26: CodePreneur Week3 - Introduction to JavaScript](https://reader033.vdocuments.us/reader033/viewer/2022051706/58efd0331a28abef048b456d/html5/thumbnails/26.jpg)
COMMON EVENTSonload, onchange, onclick, onmouseover, onmouseout, onkeydown
![Page 27: CodePreneur Week3 - Introduction to JavaScript](https://reader033.vdocuments.us/reader033/viewer/2022051706/58efd0331a28abef048b456d/html5/thumbnails/27.jpg)
BOM
![Page 28: CodePreneur Week3 - Introduction to JavaScript](https://reader033.vdocuments.us/reader033/viewer/2022051706/58efd0331a28abef048b456d/html5/thumbnails/28.jpg)
BROWSER OBJECT MODELThis is how JS is able to talk to the browser
![Page 29: CodePreneur Week3 - Introduction to JavaScript](https://reader033.vdocuments.us/reader033/viewer/2022051706/58efd0331a28abef048b456d/html5/thumbnails/29.jpg)
Some BOM.history, location
![Page 30: CodePreneur Week3 - Introduction to JavaScript](https://reader033.vdocuments.us/reader033/viewer/2022051706/58efd0331a28abef048b456d/html5/thumbnails/30.jpg)
Popups.alert, prompt, confirm
![Page 31: CodePreneur Week3 - Introduction to JavaScript](https://reader033.vdocuments.us/reader033/viewer/2022051706/58efd0331a28abef048b456d/html5/thumbnails/31.jpg)
Conditions.Ifs, elses, and switches
![Page 32: CodePreneur Week3 - Introduction to JavaScript](https://reader033.vdocuments.us/reader033/viewer/2022051706/58efd0331a28abef048b456d/html5/thumbnails/32.jpg)
Loops.for (i = 0; i < 5; i++), while (i < 10)
![Page 33: CodePreneur Week3 - Introduction to JavaScript](https://reader033.vdocuments.us/reader033/viewer/2022051706/58efd0331a28abef048b456d/html5/thumbnails/33.jpg)
Strings.and their awesome features
![Page 34: CodePreneur Week3 - Introduction to JavaScript](https://reader033.vdocuments.us/reader033/viewer/2022051706/58efd0331a28abef048b456d/html5/thumbnails/34.jpg)
To the Laband we’ll stay there
![Page 35: CodePreneur Week3 - Introduction to JavaScript](https://reader033.vdocuments.us/reader033/viewer/2022051706/58efd0331a28abef048b456d/html5/thumbnails/35.jpg)
See ya!