Lecture Web technologies and programming – Lecture 21: jQuery, data description and transformation, XML, DOM. After studying this chapter you will be able to understand: Introduction to jQuery, DOM and jQuery, jQuery Selectors and events, DOM Objects, XML, components of XML. | 1 CIIT-Human Computer Interaction-CSC456-Fall-2015-Mr. Tehseen Riaz Abbasi 1 2 3 3 The history object The navigator object The user browser The browser Engine The browser platform The browser language The screen object The form object Accessing from element Setting form element 4 Validating form data DATA Validation 5 Introduction to jQuery DOM and jQuery jQuery Selectors and events DOM Objects XML Components of XML 6 “jQuery is a lightweight JavaScript library that emphasizes interaction between JavaScript and HTML.” Developed by John Resig at Rochester Institute of Technology “jQuery is free, open source software Dual-licensed under the MIT License and the GNU General Public License.” “It’s all about simplicity. Why should web developers be forced to write long, complex, book-length pieces of code when they want to create simple pieces of interaction?” 7 Rich Internet Applications (RIA) Dynamic HTML (DHTML) “Unobtrusive” JavaScript – separation of behavior from structure Allows adding JavaScript to your web pages Much easier to use Eliminates cross-browser problems Mobile First Web Development 8 jQuery also simplifies a lot of the complicated things from JavaScript, like AJAX calls and DOM manipulation. The jQuery library contains the following features: HTML/DOM manipulation CSS manipulation HTML event methods Effects and animations AJAX (Asynchronous JavaScript and XML. 9 DOM stands for Document Object Model “The Document Object Model (DOM) is a cross-platform and language-independent convention for representing and interacting with objects in HTML, XHTML and XML documents. Aspects of the DOM (such as its "Elements") may be addressed and manipulated within the syntax of the programming language in use.” 10 11 jQuery is “DOM scripting” Hierarchal structure of a web page You can add and subtract DOM elements on the fly You can change the properties and contents of DOM elements on the fly jQuery uses DOM elements to manipulate a web page. 12 The jQuery syntax is . | 1 CIIT-Human Computer Interaction-CSC456-Fall-2015-Mr. Tehseen Riaz Abbasi 1 2 3 3 The history object The navigator object The user browser The browser Engine The browser platform The browser language The screen object The form object Accessing from element Setting form element 4 Validating form data DATA Validation 5 Introduction to jQuery DOM and jQuery jQuery Selectors and events DOM Objects XML Components of XML 6 “jQuery is a lightweight JavaScript library that emphasizes interaction between JavaScript and HTML.” Developed by John Resig at Rochester Institute of Technology “jQuery is free, open source software Dual-licensed under the MIT License and the GNU General Public License.” “It’s all about simplicity. Why should web developers be forced to write long, complex, book-length pieces of code when they want to create simple pieces of interaction?” 7 Rich Internet Applications (RIA) Dynamic HTML (DHTML) “Unobtrusive” JavaScript – separation of behavior from structure Allows .
