JQuery - Tutorialspoint

3y ago
109 Views
31 Downloads
977.35 KB
44 Pages
Last View : 2m ago
Last Download : 3m ago
Upload by : Rosa Marty
Transcription

jQueryi

jQueryAbout the TutorialjQuery is a fast and concise JavaScript library created by John Resig in 2006. jQuerysimplifies HTML document traversing, event handling, animating, and Ajax interactions forRapid Web Development.AudienceThis tutorial is designed for software programmers who wants to learn the basics of jQueryand its programming concepts in simple and easy ways. This tutorial will give you enoughunderstanding on components of jQuery with suitable examples.PrerequisitesBefore proceeding with this tutorial, you should have a basic understanding of HTML, CSS,JavaScript, Document Object Model (DOM) and any text editor. As we are going to developweb based application using jQuery, it will be good if you have understanding on howinternet and web based applications workCopyright & Disclaimer Copyright 2015 by Tutorials Point (I) Pvt. Ltd.All the content and graphics published in this e-book are the property of Tutorials Point (I)Pvt. Ltd. The user of this e-book is prohibited to reuse, retain, copy, distribute or republishany contents or a part of contents of this e-book in any manner without written consentof the publisher.We strive to update the contents of our website and tutorials as timely and as precisely aspossible, however, the contents may contain inaccuracies or errors. Tutorials Point (I) Pvt.Ltd. provides no guarantee regarding the accuracy, timeliness or completeness of ourwebsite or its contents including this tutorial. If you discover any errors on our website orin this tutorial, please notify us at contact@tutorialspoint.comi

jQueryTable of ContentsAbout the Tutorial . iAudience . iPrerequisites . iCopyright & Disclaimer. iTable of Contents . ii1.OVERVIEW. 1What is jQuery? . 1How to use jQuery? . 1Local Installation . 2CDN Based Version . 2How to Call a jQuery Library Functions? . 3How to Use Custom Scripts?. 4Using Multiple Libraries . 5What is Next ? . 62.BASICS . 7String . 7Numbers . 7Boolean . 7Objects . 8Arrays. 8Functions . 8Arguments . 9Context . 9Scope . 10Callback . 10ii

jQueryClosures . 11Proxy Pattern . 12Built-in Functions . 12The Document Object Model . 133.SELECTORS . 15The () Factory Function . 15How to Use Selectors?. 17jQuery - Element Name Selector . 17jQuery - Element ID Selector . 19jQuery - Element Class Selector . 20jQuery - Universal Selector . 22jQuery - Multiple Elements Selector . 24Selectors Examples . 264.JQUERY ATTRIBUTES. 31Get Attribute Value . 31Set Attribute Value. 32Applying Styles . 33Attribute Methods . 34attr( properties ) Method . 35attr( key, func ) Method . 37removeAttr( name ) Method . 39hasClass( class ) Method . 40removeClass( class ) Method . 42toggleClass( class ) Method . 43html( ) Method . 44html( val ) Method . 46text( ) Method . 47iii

jQuerytext( val ) Method . 48val( ) Method . 50val( val ) Method . 515.DOM TRAVERSING . 55Find Elements by Index . 55Filtering Out Elements . 57Locating Descendent Elements . 58JQuery DOM Filter Methods . 59eq( index ) Method. 60filter( selector ) Method . 61filter( fn ) Method . 63is( selector ) Method . 64map( callback ) Method. 66not( selector ) Method . 68slice( start, end ) Method . 70JQuery DOM Traversing Methods . 71add( selector ) Method . 73andSelf( ) Method . 75children( [selector] ) Method . 76closest( selector ) Method . 77contents( ) Method . 79end( ) Method . 80find( selector ) Method . 81next( [selector] ) Method . 83nextAll( [selector] ) Method . 84offsetParent() Method . 85parent( [selector] ) Method . 86iv

jQueryparents( [selector] ) Method . 88prev( [selector] ) Method . 89prevAll( [selector] ) Method . 91siblings( [selector] ) Method . 926.CSS SELECTOR METHODS . 94Apply CSS Properties . 94Apply Multiple CSS Properties . 94Setting Element Width & Height . 96JQuery CSS Methods . 97css( name ) Method . 98css( name, value ) Method . 100css( properties ) Method . 101height( val ) Method. 103height( ) Method . 105innerHeight( ) Method . 106innerWidth( ) Method . 108offset( ) Method . 110offsetParent( ) Method . 112outerHeight( [margin] ) Method . 114outerWidth( [margin] ) Method . 116position( ) Method . 118scrollLeft( val ) Method . 120scrollLeft( ) Method . 121scrollTop( val ) Method . 123scrollTop( ) Method . 125width( val ) Method . 128width( ) Method . 129v

jQuery7.DOM MANIPULATION. 132Content Manipulation . 132DOM Element Replacement . 133Removing DOM Elements . 135Inserting DOM Elements . 136DOM Manipulation Methods . 138after( content ) Method . 140append( content ) Method . 141appendTo( selector ) Method . 143before( content ) Method . 144clone( bool ) Method . 146clone( ) Method. 148empty( ) Method . 149html( val ) Method . 151html( ) Method . 152insertAfter( selector ) Method . 155insertBefore( selector ) Method . 157prepend( content ) Method . 159prependTo( selector ) Method .

jQuery is a fast and concise JavaScript library created by John Resig in 2006. jQuery simplifies HTML document traversing, event handling, animating, and Ajax interactions for Rapid Web Development.

Related Documents:

Chapter 1: Getting started with jQuery 2 Remarks 2 Versions 2 Examples 3 jQuery Namespace ("jQuery" and " ") 3 Getting Started 3 Explanation of code 4 Include script tag in head of HTML page 5 Avoiding namespace collisions 6 Loading jQuery via console on a page that does not have it. 8 The jQuery Object 8 Loading namespaced jQuery plugins 8 .

jQuery is the starting point for writing any jQuery code. It can be used as a function jQuery(.) or a variable jQuery.foo. is an alias for jQuery and the two can usually be interchanged for each other (except where jQuery.noConflict(); has been used - see Avoiding namespace collisions). Assuming we have this snippet of HTML -

jQuery is the starting point for writing any jQuery code. It can be used as a function jQuery(.) or a variable jQuery.foo. is an alias for jQuery and the two can usually be interchanged for each other (except where jQuery.noConflict(); has been used - see Avoiding namespace collisions). Assuming we have this snippet of HTML -

To get started with the jQuery UI library, you'll need to add the jQuery script, the jQuery UI script, and the jQuery UI stylesheet to your HTML. First, download jQuery UI; choose the features you need on the download page.

browsers. However, the jQuery team has taken care of this for us, so that we can write AJAX functionality with only one single line of code jQuery - AJAX load() Method jQuery load() Method The jQuery load() method is a simple, but powerful AJAX method. The load() method loads data from a server and puts the returned data into the selected element.

jQuery UI 1.8.16 jQuery Timepicker Addon 1.4.5 jquery-2.1.0 jQuery-ui-1.10.4 jquery-2.1.0 jQuery.event.drag - v 2.2 . WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH T

elements to operate upon with the jQuery library methods. Understanding jQuery selectors is the key to using the jQuery library most effectively. This reference card puts the power of jQuery selectors at your very fingertips. A jQuery statement typically follows the syntax pattern: by any sibling of tag name E. (selector).methodName();

Implementing JQuery Plugins Implementing jQuery plugins into your site is fairly easy, and as you move through this lecture, you'll notice a pattern in implementing a jQuery plugin. Once you link to the the main jQuery library in your HTML document, using a plugin usually involves the following steps: 1.