Your SlideShare is downloading. ×
JavaScript and jQuery Basics
JavaScript and jQuery Basics
JavaScript and jQuery Basics
JavaScript and jQuery Basics
JavaScript and jQuery Basics
JavaScript and jQuery Basics
JavaScript and jQuery Basics
JavaScript and jQuery Basics
JavaScript and jQuery Basics
JavaScript and jQuery Basics
JavaScript and jQuery Basics
JavaScript and jQuery Basics
JavaScript and jQuery Basics
JavaScript and jQuery Basics
JavaScript and jQuery Basics
JavaScript and jQuery Basics
JavaScript and jQuery Basics
Upcoming SlideShare
Loading in...5
×

Thanks for flagging this SlideShare!

Oops! An error has occurred.

×
Saving this for later? Get the SlideShare app to save on your phone or tablet. Read anywhere, anytime – even offline.
Text the download link to your phone
Standard text messaging rates apply

JavaScript and jQuery Basics

1,976

Published on

JavaScript and jQuery Basics | Software Engineering and Management Master Class at Varna Free University

JavaScript and jQuery Basics | Software Engineering and Management Master Class at Varna Free University

Published in: Education, Technology
0 Comments
2 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total Views
1,976
On Slideshare
0
From Embeds
0
Number of Embeds
1
Actions
Shares
0
Downloads
96
Comments
0
Likes
2
Embeds 0
No embeds

Report content
Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
No notes for slide

Transcript

  • 1. JavaScript & jQuery Basics
  • 2. JavaScript & jQuery | Agenda           JavaScript Capabilities JavaScript Basics & Syntax. Introduction to jQuery jQuery Advantages Why jQuery is So Popular? jQuery Selectors & Methods Live Demo jQuery Events Live Demo Beyond Basics Live Demo Useful Resources Time for Questions
  • 3. Introduction to JavaScript Front-end Technologies General Overview.
  • 4. JavaScript | Capabilities  Implementing form validation  React to user actions (click, mouse over…)  Appearing and disappearing elements  Content loading and changing dynamically  Performing complex calculations  Implementing Custom controls  Implementing AJAX functionality  … and many more.
  • 5. JavaScript | Basics.  <script> tag in the head  <script> tag in the body  <script> tag external source (always empty)  Inline, for example: <img src="DevLabs.jpg" onclick="alert('clicked!')" />
  • 6. JavaScript | Syntax.  Operators (+, *, =, !=, &&, ++, …)  Variables (typeless)  Conditional statements (if, else)  Loops (for, while)  Arrays (my_array[]) and associative arrays (my_array['abc'])  Functions
  • 7. Introduction to jQuery Write less, do more.
  • 8. jQuery Advantages  Free, open source software  cross-browser JavaScript library  simplify the client-side scripting of HTML  syntax is designed to make it easier to  navigate the document and select DOM elements  Create animations  Handle events  Develop advanced applications/effects
  • 9. Why jQuery is So Popular?  Easy to learn  Easy to extend - you create new jQuery plugins by creating new JavaScript functions  Powerful DOM Selection  Powered by CSS 3.0  Lightweight  Community Support with large community of developers and geeks
  • 10. jQuery | Selectors & Methods  as the syntax used in CSS to apply styles  html(), css(), text(), show(), hide()… Live Demo
  • 11. jQuery | Events Mouse events:  onclick, onmousedown, onmouseup  onmouseover, onmouseout, onmousemove Key events:  onkeypress, onkeydown, onkeyup Interface events:  onblur, onfocus  onscroll
  • 12. jQuery | Events Live Demo
  • 13. jQuery | Beyond Basics Live Demo
  • 14. Useful Resources JavaScript Basics: http://jqfundamentals.com/chapter/javascriptbasics A guide to the basics of jQuery: http://jqfundamentals.com/
  • 15. Kaloyan Kosev, Web Developer superkalo@devlabs.bg LinkedIn/superKalo Facebook/superKalo
  • 16. JavaScript & jQuery Time for Questions.
  • 17. Output + Feedback Facebook Group: Software Engineering and Management - Master Class http://www.facebook.com/groups/1425392611009770/ Homework: Code the front-end main JavaScript & jQuery functionalities of your projects.

×