Introduction to jQuery (Ajax Exp 2006)

Feb 28, 20133 likes2,454 views

This document summarizes jQuery, an open source JavaScript library. It simplifies HTML and JavaScript interaction by allowing developers to select elements, handle events, perform animations and AJAX calls with simple and concise code. The document highlights key features like DOM manipulation, events, effects and plugins. It also discusses jQuery's community, adoption by major sites, and future plans.

jQuery
New Wave JavaScript
Ajax Experience - Oct 2006

John Resig (ejohn.org)

What is jQuery?

• An open source JavaScript library that
simpliﬁes the interaction between HTML
and JavaScript.

Why jQuery?
• Fully documented
• Great community
• Tons of plugins
• Small size (15kb)
• Everything works in IE 5.5+, Firefox, Safari
1.3+, and Opera 8+

Complete Focus:

• Find some elements
• Do something with them

Find Some Elements...

• Full CSS 1-3 Support
• Basic XPath
• Better CSS support than most browsers

$(“div”)
<div id=”body”>
<h2>Some Header</h2>
<div class=”contents”>
<p>...</p>
<p>...</p>
</div>
</div>

$(“#body”)
<div id=”body”>
<h2>Some Header</h2>
<div class=”contents”>
<p>...</p>
<p>...</p>
</div>
</div>

$(“div#body”)
<div id=”body”>
<h2>Some Header</h2>
<div class=”contents”>
<p>...</p>
<p>...</p>
</div>
</div>

$(“div.contents p”)
<div id=”body”>
<h2>Some Header</h2>
<div class=”contents”>
<p>...</p>
<p>...</p>
</div>
</div>

$(“div > div”)
<div id=”body”>
<h2>Some Header</h2>
<div class=”contents”>
<p>...</p>
<p>...</p>
</div>
</div>

Features

• Events (click, hover, toggle)
• DOM Manipulation (append, prepend, remove)
• Effects (hide, show, slideDown, fadeOut)
• AJAX (load, get, post)

Events

• $(“form input:last”).click(function(){
$(“#menu”).slideDown(“slow”);
});

DOM Manipulation

• $(“a[@target]”)
.append(“ (Opens in New Window)”);
• $(“#body”).css({
border: “1px solid green”,
height: “40px”
});

Effects

• $(“#menu”).slideDown(“slow”);
• $(“div”).hide(500,function(){
$(this).show(500);
});

AJAX

• $(“#body”).load(“sample.html”);
• $.getScript(“test.js”);

Chaining

• $(“div”).hide();
• $(“div”).hide().color(”blue”);
• $(“div”).hide().color(”blue”).slideDown();

Plugins

• Drag and Drop
• Sortables
• Tabbed Navigation
• Sortable Tables
• And over 80 more...

Community

• Very active mailing list
• 90+ Posts/Day
• 640+ Members
• Technorati: 10+ blog posts per day

Who uses jQuery?

• MSNBC
• Technorati
• Feedburner
• Drupal
• many others...

Future

• Internationalization
• Plugin Community (think Sourceforge)
• Fixing “Hard” Problems

jquery.com
jquery.com/docs - jquery.com/plugins

More:
visualjquery.com
learningjquery.com

This document summarizes the many updates and releases of jQuery between March 2008 and the last Drupal release. It notes the numerous bug fix and speed improvement releases of jQuery 1.1 and 1.2. It also describes new features added to jQuery like animations, special events, namespaced events, and element data to make it more extensible through plugins. It highlights the large plugin ecosystem and upcoming jQuery UI and Enchant projects.

JavaScript Library Overview (Ajax Exp West 2007)jeresig

This document summarizes and compares several popular JavaScript libraries: Dojo, Prototype, jQuery, Mootools, and YUI. It outlines the focus, key features, documentation/community support, file size, and popularity for each library. The libraries provide DOM manipulation, event handling, effects/animations, and Ajax capabilities with varying levels of features and complexity. jQuery is highlighted as having a small file size and strong popularity while providing core functionality.

bcgr3-jquerytutorialsruby

jQuery is a popular JavaScript library that makes it easier to manipulate DOM elements and handle browser inconsistencies. It is used by many major websites and open source projects. jQuery benefits developers by providing a simple yet powerful API, unobtrusive code, small file size, and an active community. The jQuery syntax is designed to resemble CSS selectors, making it intuitive for designers and developers to use.

jQuery Makes Writing JavaScript Fun Again (for HTML5 User Group)Doris Chen

Get frustrated by cross-browser incompatibility? Hate to develop application using JavaScript? jQuery is a powerful JavaScript library that can enhance your websites regardless of your background. jQuery is fast, lean, simple and hugely expandable, enabling you to build compelling web applications quickly and easily. In this session, we will start with a quick introduction of jQuery, illustrate what’s so good about jQuery, and demonstrate step by step how to develop jQuery Ajax application efficiently with database, web services, OData, NetFlix and ASP.NET MVC. Microsoft is now shipping, supporting, and contributing to jQuery, with ASP.NET and Visual Studio. New features which will be available in the next release of jQuery such as globalization, templating and data-linking will be introduced in the session as well.

Short intro to JQuery and ModernizrJussi Pohjolainen

The document provides an introduction to JQuery and Modernizr. It discusses how JQuery simplifies common tasks like DOM manipulation, event handling, and Ajax interactions. It also explains how Modernizr detects browser features to avoid unreliable user agent sniffing. The document includes examples of basic JQuery syntax and functions for selecting elements, creating/inserting elements, and animations.

JQueryJussi Pohjolainen

The document introduces JQuery, a JavaScript library that simplifies HTML document manipulation, event handling, animations, and AJAX interactions. It explains that JQuery downloads as a JavaScript file that can then be referenced in an HTML page, allowing developers to select elements and use JQuery functions rather than traditional JavaScript methods. Basic JQuery syntax, selectors, DOM manipulation, and animation functions are demonstrated.

jQuery LearningUzair Ali

This document provides an introduction to jQuery, a lightweight JavaScript library. It discusses jQuery's benefits like less code, improved efficiency, excellent documentation. It also covers jQuery concepts like DOM scripting, unobtrusive code, and the $() function. The document demonstrates jQuery selectors, HTML manipulation, CSS manipulation, events, effects, and AJAX calls. It mentions that Microsoft will distribute jQuery with Visual Studio.

Drupal 7: What's In It For You?karschsp

Drupal 7 introduces several new features including requirements for PHP5 and newer database versions, an automated testing framework called SimpleTest, a new database abstraction layer called DBTNG, improved user experience with the D7UX project, support for RDFa semantic metadata, updated theming system called Stark, a reworked Field API, updated file and image handling, and more. The presentation encourages helping with Drupal 7 by contributing to documentation, testing patches, submitting patches, and spreading awareness of the new version.

jQuery: Nuts, Bolts and BlingDoug Neiner

An introduction to jQueryJames Wragg

This document introduces Madgex, a JavaScript library that aims to simplify coding and remove cross-browser headaches. It can select elements using CSS selectors and XPath, then manipulate, modify, and return values for those elements. Methods can be chained together. Madgex supports events, AJAX, and animation functionality. It is small at 19KB minified and gzipped. Developers select elements and then perform actions on them such as setting styles, adding/removing attributes, and handling events.

CT presentatie JQuery 7.12.11virtualsciences41

This document discusses using jQuery for building rich internet applications and provides tips to avoid making a mess of projects with jQuery. It recommends choosing jQuery due to its large community and documentation but warns that jQuery can lead to unmaintainable code if not used properly. It provides examples of bad jQuery code that mixes concerns of structure, style and behavior, and good code that uses semantic classes, progressive enhancement, and external templates. The document advises to separate styling from interaction, use semantics, external templates, and learn real JavaScript concepts beyond jQuery.

Introduction to j querythewarlog

The document is an introduction to jQuery presentation. It discusses what jQuery is, how to set it up and include it in a webpage, its core functionality and structure, and how it is used to select and manipulate elements on a page. jQuery is a lightweight JavaScript library that makes HTML document manipulation and event handling easier. It works across browsers and has thousands of plugins. The presentation provides examples of how jQuery simplifies tasks like showing/hiding elements compared to vanilla JavaScript.

Sakai customization talkcroby

The document discusses customizing the Open Academic Environment (OAE) experience in Sakai. It describes how to configure elements like the CSS, navigation, categories, permissions, copyright options, default pages and user spaces. It also introduces the concept of "worlds" to define different types of spaces that can be created, with configurable templates, roles and content. The document provides information on internationalization, single sign-on, error pages and enabling hybrid OAE/Sakai functionality.

jQuery IntroductionArwid Bancewicz

The document introduces the jQuery library, which is a popular JavaScript library that simplifies tasks like HTML document traversal, event handling, animating, and Ajax interactions. It notes that over 20% of websites use jQuery and outlines some of its main capabilities like selecting elements, hiding/showing elements, and loading remote HTML. Alternatives to jQuery are mentioned but it is positioned as standing alone in popularity based on Google search volumes.

HTML5: IntroductionGuillermo Paz

A Short Introduction To jQuerySudar Muthu

The document discusses jQuery, a popular JavaScript library. It provides concise summaries of jQuery's main features and capabilities, including: - Using CSS selectors to select DOM elements and perform actions on them. - Returning collections of matched elements that can be iterated, accessed, and manipulated. - Methods for DOM manipulation like adding/removing classes, setting styles, and event handling. - Support for AJAX calls and utilities for browser detection. - Large ecosystem of plugins for additional functionality.

D3.js and SVGKarol Depka Pradzinski

The document is a presentation about D3 and SVG technologies. It includes sections on networking opportunities, an interactive presentation format, polls about experience levels with D3 and SVG, examples of force-directed graphs and animated SVGs using D3, and details on implementing drag and drop as well as mouseover highlighting in a D3 visualization. The presentation source code is provided on GitHub and other examples are referenced, including alternatives to SVG. It concludes with another poll and a question and answer period.

Dojo, from scratch to resultNikolai Onken

JQuery Comprehensive OverviewMohamed Loey

JavaScript the Smart Way - Getting Started with jQuerykatbailey

jQuery State of the Union - Yehuda KatzMarakana Inc.

What's the state of the most popular JavaScript library today? What's in-store for upcoming releases? At an event hosted at Microsoft on November 9th, 2010, Yehuda Katz (a core member of the jQuery team) talked about updates planned for jQuery 1.4.3 and plans for jQuery 1.5, due next year. He also covers: - initiatives of the jQuery project - jQuery mobile - formalizing governance of the jQuery project ** See the video at: http://marakana.com/f/12312 ** Stay tuned for videos of these presentations from this event: - jQuery jump start (15 min. session to get you productive with the JavaScript frameworks) - jQuery with ASP.NET and Visual Studio Walk-through - How jQuery continues to drive innovation with emerging technologies In the meantime, check out more videos on open source development at: http://marakana.com/techtv

How dojo worksAmit Tyagi

Harness jQuery Templates and Data LinkBorisMoore

This document discusses using jQuery Templates and Data Link to build dynamic data-driven browser applications. It describes how jQuery Templates can be used to render templates from data but offers limited interactivity. jQuery Data Link allows binding data to HTML but has no templating. The presentation previews a new approach called JsViews that integrates Templates and Data Link to provide both fast rendering of templates to static HTML strings as well as fully interactive and responsive views through two-way data binding between templates and JavaScript data objects.

JQuerybaabtra.com - No. 1 supplier of quality freshers

This document discusses jQuery, a JavaScript library that simplifies HTML document manipulation and user interaction. It allows selecting elements, modifying content and styling, handling events, and using AJAX. Some key benefits are cross-browser compatibility and a CSS-like syntax. Examples provided include forms, chat boxes, menus, and animations. Selectors allow finding elements by ID, class, type and other attributes. Events like click can have functions attached. jQuery is used by many large companies and helps build interactive web pages.

jQuery (BostonPHP)jeresig

Virtual Reality for Science & Education - Lecture 4Robin de Lange

This document discusses the potential of virtual reality (VR) for education. It begins by providing an overview of VR, including its use for gaming, immersive cinema, and interactive storytelling. VR is described as a new medium that can simulate other media and provide highly interactive and personalized learning experiences. The document concludes by assigning groups of students to research educational VR apps, discuss their qualities and potential for improvement, and present their findings to the class.

InfopackGabriel BREZOIU

The document announces a 7-day training course on intercultural learning to be held in Kharkiv, Ukraine from April 7-14, 2014. The training will bring together 30 youth workers from 10 countries in Europe and Eastern Europe/Caucasus. The goals of the training are to help participants better understand different cultures, racism, and challenges of cultural diversity, and to empower them to be active citizens. Participants are asked to bring presentations on their organizations and countries to share their cultures through food, music, images and more. Travel reimbursement details and accommodation information is provided.

Software Heritage: let's build together the universal archive of our software...Codemotion

Free/Open Source Software is now everywhere, but the risk of losing forever some of it is growing. Shutdowns of once popular forges are early warnings that we should not underestimate. How many million lines of code would we lose if development hubs that are hype today were to disappear 20 years from now? This talk will present Software Heritage, whose aim is to collect, preserve, and share all publicly available source code. Forever. Software Heritage has already archived 3 billion distinct source code files and 650 million commits, spanning more than 25 million development projects.

More Related Content

What's hot (19)

jQuery LearningUzair Ali

Drupal 7: What's In It For You?karschsp

jQuery: Nuts, Bolts and BlingDoug Neiner

An introduction to jQueryJames Wragg

CT presentatie JQuery 7.12.11virtualsciences41

Introduction to j querythewarlog

Sakai customization talkcroby

jQuery IntroductionArwid Bancewicz

HTML5: IntroductionGuillermo Paz

A Short Introduction To jQuerySudar Muthu

D3.js and SVGKarol Depka Pradzinski

Dojo, from scratch to resultNikolai Onken

JQuery Comprehensive OverviewMohamed Loey

JavaScript the Smart Way - Getting Started with jQuerykatbailey

jQuery State of the Union - Yehuda KatzMarakana Inc.

How dojo worksAmit Tyagi

Harness jQuery Templates and Data LinkBorisMoore

JQuerybaabtra.com - No. 1 supplier of quality freshers

jQuery (BostonPHP)jeresig

jQuery LearningUzair Ali

Drupal 7: What's In It For You?karschsp

jQuery: Nuts, Bolts and BlingDoug Neiner

An introduction to jQueryJames Wragg

CT presentatie JQuery 7.12.11virtualsciences41

Introduction to j querythewarlog

Sakai customization talkcroby

jQuery IntroductionArwid Bancewicz

HTML5: IntroductionGuillermo Paz

A Short Introduction To jQuerySudar Muthu

D3.js and SVGKarol Depka Pradzinski

Dojo, from scratch to resultNikolai Onken

JQuery Comprehensive OverviewMohamed Loey

JavaScript the Smart Way - Getting Started with jQuerykatbailey

jQuery State of the Union - Yehuda KatzMarakana Inc.

How dojo worksAmit Tyagi

Harness jQuery Templates and Data LinkBorisMoore

JQuerybaabtra.com - No. 1 supplier of quality freshers

jQuery (BostonPHP)jeresig

Viewers also liked (20)

Virtual Reality for Science & Education - Lecture 4Robin de Lange

InfopackGabriel BREZOIU

Software Heritage: let's build together the universal archive of our software...Codemotion

Foro computacionUTPL

Este documento describe cómo los archivos digitales en formatos como PDF, DOCX, XLSX y JPG se usan frecuentemente en el área administrativa de una empresa para transmitir información rápidamente a diferentes departamentos. Gracias a la tecnología moderna, la transmisión de información se puede hacer de manera eficiente. En la actualidad, es común compartir archivos digitales a través de redes sociales, sistemas de entrega virtual de tareas y descargas de bibliografía, aprovechando las herramientas que brindan las nuevas tecnolog

國際人權法期末報告Dennis Chen

Folleto padresTrianaRodriguez22

Este documento ofrece recomendaciones para padres sobre el uso adecuado de la televisión por parte de los niños. Sugiere limitar el tiempo frente a la pantalla, establecer normas claras sobre los contenidos permitidos y ver televisión en familia para guiar la comprensión crítica de los niños. También recomienda ubicar los televisores en áreas comunes en lugar de las habitaciones y aprovechar la televisión como una oportunidad de enseñanza y discusión entre padres e hijos.

LOS FRENOS DEL PODER.AUTOR: Rafael Jiménez Asensio.ISBN: 9788491230700Marcial Pons Argentina

Este documento es una introducción a un libro sobre la separación de poderes y el control de las instituciones en los sistemas constitucionales. El autor explica que el libro fue escrito a lo largo de varios años, estimulado por su trabajo docente y como consultor del sector público. El libro explora los antecedentes históricos de la separación de poderes, su evolución en sistemas como Estados Unidos y Europa continental, y nuevos paradigmas como los tribunales constitucionales, los derechos fundamentales y las autoridades independientes. El autor

A Little Book of Listening SkillsGautham Rajesh

This document is an excerpt from the book "A Little Book of Listening Skills" which provides 52 essential practices for developing listening skills to love oneself and others. The excerpt discusses several listening skills including stopping talking so much to listen more, avoiding unnecessary interruptions, creating an atmosphere of trust, listening for signs of disrespect or lack of mutual purpose in conflicts, and cultivating "Beginner's Ear" by paying close attention to details with curiosity and wonder. The full book provides exercises to develop these and other listening skills.

водоростіkatia0401

Market Demandmattbentley34

This document provides an overview of key concepts related to demand, including: - The definition of demand as the quantity willing and able to be purchased at a given price. - How the demand curve illustrates the inverse relationship between price and quantity demanded. - Factors that can cause a shift in the demand curve, such as changes in income, prices of substitutes/complements, and non-economic factors. - The concept of utility and how the principle of diminishing marginal utility helps explain the downward slope of the demand curve.

Communitydays2015Matteo Valoriani

La battaglia del touchless: quale è la migliore tecnologia oggi disponibile e come sceglierla. Mostreremo le caratteristiche di vari device disponibili sul mercato (Kinect2, RealSense, Myo, Leap) e analizzeremo i casi d'uso dei diversi device evidenziandone vantaggi e svantaggi (distanza, precisione, supporto...) e come possono essere combinati tra loro. La sessione si concluderà con alcuni criteri di scelta che devono essere considerati prima di iniziare lo sviluppo e che possono evitare problemi e migliorare il risultato finale.

Moodle2 FormularioJuan José Gual

PDAdhz96

El PDA (ordenador de bolsillo o asistente digital personal) es un dispositivo electrónico portátil diseñado para almacenar y administrar información personal. Su historia comienza en 1992 con el Apple Newton, aunque fue Palm quien popularizó los PDA en 1995. Hoy en día, la mayoría de PDA son smartphones. Proporcionan ventajas como facilitar las tareas diarias y estar siempre conectado, aunque algunos los consideran adictivos y lentos en ocasiones.

10 Reasons To Attend The Content Marketing Workshoptrish321

This document advertises a two-day Constant Cash with Content Marketing (CCCM) workshop happening on October 25-26, 2013 at the Philippine Trade Training Center. The workshop will teach attendees how to create valuable content once and reuse it for multiple purposes, attract customers and build trust through social media and content marketing, create their own agency using advanced social media skills, and transform themselves into a valuable professional through the workshop. Attendees will receive a complete set of e-presentations and can meet like-minded participants.

Numeracion 2avapla81

Cómo te pueden ayudar los dispositivos móviles en fotografíaRolando Mireles

Los dispositivos móviles pueden ayudar a los fotógrafos de varias maneras, incluyendo el uso de aplicaciones para geoposicionar fotos, medir la luz, previsualizar y editar imágenes, controlar las cámaras de forma remota, acceder a tutoriales interactivos, y más. Aunque los dispositivos móviles no reemplazan a las cámaras DSLR, ofrecen recursos útiles para mejorar la fotografía y facilitar el trabajo diario de los fotógrafos.

Desarrollo histórico de la formación de sociólogos en la universidadAnny Jimenez Torrano

La formación de sociólogos en México ha pasado por dos etapas principales. En la primera etapa, la sociología se incorporó a la Escuela Nacional Preparatoria en 1875, pero no fue hasta 1895 que se estableció como una materia específica. En la segunda etapa posrevolucionaria, la sociología académica se consolidó con la creación en 1939 de la Revista Mexicana de Sociología y la Escuela Nacional de Ciencias Políticas y Sociales, que estableció los primeros programas de sociología. Hoy en día, la sociología me

Sistema respiratorioProfe Lucy Pereira

El documento proporciona una descripción detallada de la anatomía del sistema respiratorio humano. Brevemente, describe las principales estructuras del tracto respiratorio superior como la nariz, senos paranasales, boca y faringe, e inferior como los bronquios y pulmones. También menciona las estructuras accesorias como las pleuras y la pared torácica. Explica las funciones del sistema respiratorio como el intercambio de gases y la protección de las vías respiratorias.

liuhecainwz1008

liuhecai的一句话把那些厨师们气的啊！牙咬得咯嘣嘣乱响，虽然自己不一定比的上那些宫廷御厨吧！liuhecai可是忙活了半天，竟从一个小屁孩儿中蹦出了个“还行”两个字，是可忍，孰不可忍，一位位liuhecai怡情居的大厨们气的是摔锅扔碗的。 liuhecai心里也有了怨言，这些大厨可都是她找人从全国各地找来的liuhecai名厨啊！实话实说怡情居的饭不比皇宫里的差，可是一个王爷的王子竟说出了，“还行！”liuhecai妈的！这不是找茬的吗？ liuhecai心里顿时有了怨言，可是她敢说吗？只得立于一旁，郁闷的看着独孤逸风。众女也个个精明聪慧，liuhecai一眼就看出了独孤逸风有心事，于是便出声询问。

Virtual Reality for Science & Education - Lecture 4Robin de Lange

InfopackGabriel BREZOIU

Software Heritage: let's build together the universal archive of our software...Codemotion

Foro computacionUTPL

國際人權法期末報告Dennis Chen

Folleto padresTrianaRodriguez22

LOS FRENOS DEL PODER.AUTOR: Rafael Jiménez Asensio.ISBN: 9788491230700Marcial Pons Argentina

A Little Book of Listening SkillsGautham Rajesh

водоростіkatia0401

Market Demandmattbentley34

Communitydays2015Matteo Valoriani

Moodle2 FormularioJuan José Gual

PDAdhz96

10 Reasons To Attend The Content Marketing Workshoptrish321

Numeracion 2avapla81

Cómo te pueden ayudar los dispositivos móviles en fotografíaRolando Mireles

Desarrollo histórico de la formación de sociólogos en la universidadAnny Jimenez Torrano

Sistema respiratorioProfe Lucy Pereira

liuhecainwz1008

Similar to Introduction to jQuery (Ajax Exp 2006) (20)

jQuery for beginnersSiva Arunachalam

This document provides an introduction to jQuery for beginners. It discusses jQuery's history and benefits, how to download and include jQuery, basic selectors and filters, traversing elements, basic events and animations, jQuery UI libraries, AJAX functionality, and compares jQuery to other JavaScript frameworks. The presentation aims to explain jQuery concepts at a high level without being a tutorial or reference guide. It includes code examples throughout to demonstrate jQuery syntax and methods.

How I Learned to Stop Worrying and Love jQuery (Jan 2013)David Giard

jQuery (MeshU)jeresig

jQuery is a JavaScript library that simplifies HTML and JavaScript interaction. It allows developers to select elements, perform actions on them such as adding/removing classes or triggering events, and chaining multiple actions together. jQuery supports CSS selectors, DOM manipulation, event handling, effects/animations, and AJAX operations. It is widely used by major websites for interactive prototypes and applications due to its small size, extensive documentation, plugins, and cross-browser compatibility.

bcgr3-jquerytutorialsruby

jQuery is a popular JavaScript library that makes it easier to manipulate HTML documents and handle browser-specific behaviors. It is used by many major websites and frameworks. jQuery simplifies tasks like getting element dimensions, handling events, developing plugins and more through its CSS selector syntax and methods. Code written with jQuery is unobtrusive, separating behavior, content and presentation for improved maintenance.

Using jQuery to Extend CSSChris Coyier

jQuery%20on%20Rails%20Presentationguestcf600a

Rails Presentation - Technology Books, Tech Conferencestutorialsruby

jQuery%20on%20Rails%20Presentationguestcf600a

JQuery-Tutorial" />tutorialsruby

Jquery fundamentalsSalvatore Fazio

The document discusses jQuery fundamentals including selectors, interacting with the DOM, handling events, and Ajax features. It provides examples and recommendations for learning jQuery including reading documentation, using tools like VSDoc and Fiddler, and consuming tea and beer. Next steps mentioned are exploring additional JavaScript libraries and frameworks like Knockout, Backbone, LINQ.js, TypeScript, and SignalR to build richer user interfaces.

SharePoint & jQuery Guide - SPSNashville 2014Mark Rackley

jQuery (DrupalCamp Toronto)jeresig

jQuery is an open source JavaScript library that simplifies HTML and JavaScript interaction by providing methods for selecting elements, handling events, performing animations and AJAX calls. It has a large community of users and developers, numerous plugins that extend its functionality, and is used by many large companies and websites. Major releases of jQuery have continued to improve performance, add new features, and expand cross-browser compatibility.

Jquery News PackagesUC Berkeley Graduate School of Journalism

jQuery is a JavaScript library that makes it easier to manipulate web pages and add interactivity. It allows developers to select HTML elements, add or modify content, and animate elements using less code than traditional JavaScript. The jQuery library is linked to in the <head> section of an HTML page using a <script> tag. jQuery commands begin with $ and use CSS selectors inside parentheses to target elements. Common commands include fadeOut(), hide(), and slideUp() to animate elements. Parameters can be passed to commands to modify their behavior.

jQuery UI and PluginsMarc Grabanski

This document discusses jQuery UI and plugins. It provides an overview of jQuery UI classes that can be used to style elements. It also demonstrates several common jQuery UI widgets like buttons, accordions, dialogs, and tabs. The document discusses jQuery UI effects for animations and transitions. It provides tips for identifying good plugins based on aspects like their API, documentation, support, and community. Overall, the document is an introduction to using jQuery UI and evaluating jQuery plugins.

Learning jQuery made exciting in an interactive session by one of our team me...Thinqloud

- jQuery is a JavaScript library that simplifies HTML document traversal and manipulation, event handling, animation, and Ajax interactions for rapid web development. It works across all major browsers. - jQuery UI provides interactive widgets, effects, and themes that can be used to build highly interactive web applications. It is built on top of the jQuery library and uses JavaScript, CSS, and HTML. Popular widgets include accordion, autocomplete, datepicker, dialog, and slider. - To use jQuery UI, developers include the jQuery-ui.js and jquery-ui.css files in their web pages. It offers interactions, widgets, effects, themes and utilities that enhance the user experience of applications.

Web2.0 with jQuery in EnglishLau Bech Lauritzen

This document provides an overview of jQuery and Web 2.0 technologies. It discusses how jQuery simplifies tasks like DOM manipulation, event handling, and Ajax. jQuery uses CSS-like selectors to find elements and chaining to perform multiple actions at once. It has a simple API for common tasks and can be extended through plugins. The document also touches on related tools like jQuery UI and jQuery Mobile.

Javascript Librarieselliando dias

This document discusses JavaScript libraries and frameworks. It provides an overview of some popular options like jQuery, Prototype, Dojo, MooTools, and YUI. It explains why developers use libraries, such as for faster development, cross-browser compatibility, and animation capabilities. The document also discusses how libraries resemble CSS and use selector syntax. Basic examples are provided to demonstrate common tasks like hover effects and row striping. Factors for choosing a library are outlined like maturity, documentation, community, and licensing. The document concludes by explaining how to obtain library code from project websites or Google's AJAX Libraries API.

JqueryZoya Shaikh

jQuery is a lightweight JavaScript library that simplifies HTML and JavaScript interaction. It was developed by John Resig at Mozilla to simplify tasks like DOM manipulation, event handling, animation, and Ajax interactions. jQuery selects elements, handles events, performs animations, and ajax calls to simplify development. Common uses include forms, menus, tabs, sliders, and slideshows. The main benefits are a large community, ease of use, strong documentation, and ability to add functionality through plugins.

JavaScript!RTigger

jQuery Rescue AdventureAllegient

In this intro-level session on utilizing jQuery with SharePoint, the focus will be to empower users on how to satisfy some of the common UI changes clients request by writing clean and unobtrusive Javascript with the help of the jQuery library. We'll begin by diving into the different ways that jQuery can be hooked up to SharePoint. We'll talk about CDN versus local copies of the library, as well as linking jQuery via masterpages, custom actions, content editor web parts, and more. We'll then spend time discussing css selectors, and some of the common patterns and jQuery methods you'll want to familiarize yourself with when targeting page-level elements. After that, the remainder of the presenation will be focused on walking through real-life scenarios of altering the UI with jQuery, such as adding interaction and animation to content query webparts, changing the behavior of links inside a page, and more. The code utilized in the presentation will be made available online after the Conference is completed.

jQuery for beginnersSiva Arunachalam

How I Learned to Stop Worrying and Love jQuery (Jan 2013)David Giard

jQuery (MeshU)jeresig

bcgr3-jquerytutorialsruby

Using jQuery to Extend CSSChris Coyier

jQuery%20on%20Rails%20Presentationguestcf600a

Rails Presentation - Technology Books, Tech Conferencestutorialsruby

jQuery%20on%20Rails%20Presentationguestcf600a

JQuery-Tutorial" />tutorialsruby

Jquery fundamentalsSalvatore Fazio

SharePoint & jQuery Guide - SPSNashville 2014Mark Rackley

jQuery (DrupalCamp Toronto)jeresig

Jquery News PackagesUC Berkeley Graduate School of Journalism

jQuery UI and PluginsMarc Grabanski

Learning jQuery made exciting in an interactive session by one of our team me...Thinqloud

Web2.0 with jQuery in EnglishLau Bech Lauritzen

Javascript Librarieselliando dias

JqueryZoya Shaikh

JavaScript!RTigger

jQuery Rescue AdventureAllegient

More from jeresig (20)

Does Coding Every Day Matter?jeresig

John Resig discusses coding every day in an August 2016 article. He started coding daily in November 2013 and has continued the practice since. While coding daily works for him by making it easier to remember projects, relieving anxiety, and allowing non-weekend work, he acknowledges it may not be necessary for others. Resig emphasizes that having passion for coding and setting goals are critical for learning and success, more so than daily coding itself.

Accidentally Becoming a Digital Librarianjeresig

John Resig discusses four problems that digital librarians face: 1) searching by image without exact matches, 2) disagreements on names and titles, 3) poor quality images, and 4) educating users. He provides examples and potential solutions for each problem, including image search tools, handling alternate names and formats, improving images through cropping and computer vision, and using question/answer interfaces to educate users. Resig advocates for open source tools and collaborative solutions to advance access to knowledge.

2014: John's Favorite Thing (Neo4j)jeresig

Neo4j is a graph database that represents data as nodes and relationships. Nodes are JSON documents that can have labels. Relationships are JSON documents that connect nodes and can have labels. Cypher is the query language for Neo4j that allows users to match patterns in the graph, return results, import and export data, and perform other operations like finding missing connections between nodes.

Computer Vision as Art Historical Investigationjeresig

Hacking Art Historyjeresig

This document summarizes John Resig's process for hacking art history databases for fun and profit. It describes scraping woodblock print data from websites, processing the data with tools like Node.js and MongoDB, and building a searchable online database called Ukiyo-e.org. It also discusses using image analysis and similarity search to validate print data and identify copies. The goal is to aid the study of woodblock prints by building open tools and data.

Using JS to teach JS at Khan Academyjeresig

1) Khan Academy teaches programming concepts to over 1.3 million students per month online. 2) They have developed a real-time JavaScript editor that uses static analysis to build challenges and allow coding on tablets and phones. 3) It runs code through analysis tools to provide error messages and hints, then uses abstract syntax trees and structured testing to check for specific functions, arguments, and program structures.

Applying Computer Vision to Art Historyjeresig

Computer vision techniques can be applied to art history in both supervised and unsupervised ways. Unsupervised methods like using image similarity tools to compare entire images or image portions can help find similar or matching images without labeling data. Supervised methods like object detection or image categorization require large labeled training datasets but can provide more precise results, identifying specific parts or categories within images. Both approaches require significant computing resources, with supervised methods needing thousands of training images and days of processing time.

NYARC 2014: Frick/Zeri Resultsjeresig

The document summarizes research using image analysis to match photographs across multiple art archives, including the Frick Art Reference Library Photoarchive and the Frederico Zeri Foundation archive. Running image matching software on over 1.2 million Frick photos and 290,000 Zeri photos revealed new connections within and between the archives. Combining the archives through automated matching discovered over 1,000 new artwork connections that had not previously been found by human researchers. The analysis demonstrates the potential of merging photo archives through computational methods to reveal new relationships and insights.

EmpireJS: Hacking Art with Node js and Image Analysisjeresig

The document discusses using computer vision and Node.js to analyze Japanese artworks like woodblock prints. It describes collecting data on prints through web scraping, processing the data with tools like PhantomJS, and using image analysis to aid studies of prints by correcting metadata and matching images. The goal is to build a website that facilitates research on ukiyo-e prints through techniques like similarity search and automated data cleaning.

Applying Computer Vision to Art Historyjeresig

This document discusses how computer vision techniques can be applied to art history. It provides an overview of different computer vision approaches such as optical character recognition (OCR), face recognition, and image similarity/categorization. Unsupervised techniques like OCR and image similarity require little labeling of data but may not provide as interesting results. Supervised techniques can more precisely locate parts of images or categorize images but require large labeled datasets. The document recommends several free and open-source computer vision libraries and tools that can be used to explore applying these techniques to art history, along with some caveats about training data requirements.

JavaScript Libraries (Ajax Exp 2006)jeresig

jQuery Recommendations to the W3C (2011)jeresig

This document discusses jQuery and web standards. It summarizes jQuery's goal of hiding browser compatibility issues while providing a simple API. It also discusses jQuery's success competing with other JavaScript libraries. The document outlines several specifications that are important to jQuery, with the DOM being the most significant. It then lists several standards and features that jQuery has used successfully. The majority of the document proposes additional standards and browser features that would be useful for jQuery and JavaScript libraries going forward, including better DOM manipulation APIs and event handling capabilities.

jQuery Open Source Process (RIT 2011)jeresig

This document summarizes the key aspects of jQuery's open source process that contributed to its early success. In the first month, new users were able to get started quickly by exploring the simple API through tutorials. An active community provided support through forums, IRC, blogs and Twitter. Documentation and examples helped users learn and expand their skills. Over the first year, as users built more applications with jQuery, its easy to use but powerful API led to increased adoption. The open development process also engaged users and helped the project grow.

jQuery Open Source Process (Knight Foundation 2011)jeresig

This document summarizes the key aspects of jQuery's open source process that contributed to its early success. It discusses how jQuery provided clear documentation, tutorials, and community resources to help users learn. It emphasizes keeping the API simple and focused on usability. It also highlights the importance of monitoring community feedback and responding to user questions. Maintaining an open development process helped users continue growing with jQuery over time.

jQuery Mobilejeresig

jQuery Mobile aims to fill the gap in mobile web development by providing a framework that works across all major mobile platforms and browsers without sacrificing the user experience. It is a two-phase project: phase one focuses on making jQuery core functionality work across all popular mobile browsers through testing and bug fixes; phase two introduces jQuery Mobile, a framework for building mobile websites and applications with widgets, layouts, and a progressive enhancement approach to ensure broad compatibility.

jQuery Open Source (Fronteer 2011)jeresig

This document discusses best practices for supporting users of open source projects based on jQuery's experience. It emphasizes providing documentation, tutorials, community support and an open development process to help users learn and succeed with the tool from their first day of use through becoming long-term contributors. Key aspects include simplifying the first experience, answering questions, addressing all skill levels, and enabling extensibility to keep users engaged over time.

Holistic JavaScript Performancejeresig

This document discusses holistic performance analysis and optimization in JavaScript. It emphasizes the importance of proving performance changes with benchmarks, considering the full browser stack and real-world use cases, maintaining clean code, prioritizing cross-browser compatibility, and clearly communicating results. Key tools mentioned include JSPerf for benchmarking, BrowserScope for hosting performance data, and Google Code Search for understanding real-world usage of APIs. The document advocates optimizing against past performance rather than competitors.

New Features Coming in Browsers (RIT '09)jeresig

This document summarizes new features coming in major browsers, including Firefox 3.5, Safari 4, Internet Explorer 9, Opera 10, and Google Chrome 2. The browsers will have better JavaScript performance due to advanced engines like TraceMonkey, SquirrelFish, and V8. New features include process per tab, postMessage for cross-domain communication, getElementsByClassName, querySelectorAll, and HTML5 features like local SQL storage, JSON support, and canvas drawing.

Meta Programming with JavaScriptjeresig

The document discusses meta-programming with JavaScript and jQuery. It shows how jQuery simplifies DOM manipulation by providing methods that make it easier to select and modify elements. The document demonstrates using jQuery to change the color and display of a div element in fewer lines of code than vanilla JavaScript. It then shows an example of extending jQuery to create a domain-specific language for additional meta-programming capabilities.

Advancing JavaScript with Libraries (Yahoo Tech Talk)jeresig

1. JavaScript libraries abstract away browser differences and complex DOM APIs to provide simpler, more consistent interfaces. 2. New library patterns that emerged like DOM selectors and behaviors advanced development by managing cross-browser issues and establishing expectations around DOM manipulation. 3. Libraries build upon one another, with higher-level "meta-libraries" and domain-specific languages creating new programming paradigms on top of existing libraries and APIs.

Does Coding Every Day Matter?jeresig

Accidentally Becoming a Digital Librarianjeresig

2014: John's Favorite Thing (Neo4j)jeresig

Computer Vision as Art Historical Investigationjeresig

Hacking Art Historyjeresig

Using JS to teach JS at Khan Academyjeresig

Applying Computer Vision to Art Historyjeresig

NYARC 2014: Frick/Zeri Resultsjeresig

EmpireJS: Hacking Art with Node js and Image Analysisjeresig

Applying Computer Vision to Art Historyjeresig

JavaScript Libraries (Ajax Exp 2006)jeresig

jQuery Recommendations to the W3C (2011)jeresig

jQuery Open Source Process (RIT 2011)jeresig

jQuery Open Source Process (Knight Foundation 2011)jeresig

jQuery Mobilejeresig

jQuery Open Source (Fronteer 2011)jeresig

Holistic JavaScript Performancejeresig

New Features Coming in Browsers (RIT '09)jeresig

Meta Programming with JavaScriptjeresig

Advancing JavaScript with Libraries (Yahoo Tech Talk)jeresig

Introduction to jQuery (Ajax Exp 2006)

1. jQuery New Wave JavaScript Ajax Experience - Oct 2006 John Resig (ejohn.org)

2. What is jQuery? • An open source JavaScript library that simpliﬁes the interaction between HTML and JavaScript.

3. Why jQuery? • Fully documented • Great community • Tons of plugins • Small size (15kb) • Everything works in IE 5.5+, Firefox, Safari 1.3+, and Opera 8+

4. Complete Focus: • Find some elements • Do something with them

5. Find Some Elements... • Full CSS 1-3 Support • Basic XPath • Better CSS support than most browsers

6. $(“div”) <div id=”body”> <h2>Some Header</h2> <div class=”contents”> <p>...</p> <p>...</p> </div> </div>

7. $(“#body”) <div id=”body”> <h2>Some Header</h2> <div class=”contents”> <p>...</p> <p>...</p> </div> </div>

8. $(“div#body”) <div id=”body”> <h2>Some Header</h2> <div class=”contents”> <p>...</p> <p>...</p> </div> </div>

9. $(“div.contents p”) <div id=”body”> <h2>Some Header</h2> <div class=”contents”> <p>...</p> <p>...</p> </div> </div>

10. $(“div > div”) <div id=”body”> <h2>Some Header</h2> <div class=”contents”> <p>...</p> <p>...</p> </div> </div>

11. $(“div[div]”) <div id=”body”> <h2>Some Header</h2> <div class=”contents”> <p>...</p> <p>...</p> </div> </div>

12. Features • Events (click, hover, toggle) • DOM Manipulation (append, prepend, remove) • Effects (hide, show, slideDown, fadeOut) • AJAX (load, get, post)

13. Events • $(“form input:last”).click(function(){ $(“#menu”).slideDown(“slow”); });

14. DOM Manipulation • $(“a[@target]”) .append(“ (Opens in New Window)”); • $(“#body”).css({ border: “1px solid green”, height: “40px” });

15. Effects • $(“#menu”).slideDown(“slow”); • $(“div”).hide(500,function(){ $(this).show(500); });

16. AJAX • $(“#body”).load(“sample.html”); • $.getScript(“test.js”);

17. Chaining • $(“div”).hide(); • $(“div”).hide().color(”blue”); • $(“div”).hide().color(”blue”).slideDown();

18. Live Demos

19. Accordion Menu

20. Hover Menu

21. Todo List

22. Plugins • Drag and Drop • Sortables • Tabbed Navigation • Sortable Tables • And over 80 more...

23. Community • Very active mailing list • 90+ Posts/Day • 640+ Members • Technorati: 10+ blog posts per day

24. Who uses jQuery? • MSNBC • Technorati • Feedburner • Drupal • many others...

25. Future • Internationalization • Plugin Community (think Sourceforge) • Fixing “Hard” Problems

26. jquery.com jquery.com/docs - jquery.com/plugins More: visualjquery.com learningjquery.com

Introduction to jQuery (Ajax Exp 2006)

Recommended

More Related Content

What's hot (19)

Viewers also liked (20)

Similar to Introduction to jQuery (Ajax Exp 2006) (20)

More from jeresig (20)

Introduction to jQuery (Ajax Exp 2006)