Una rassegna sul framework per lo sviluppo in Javascript jQuery ed alcuni suoi plugin sviluppati da Microsoft: Template e Datalink
http://www.pasqualepuzio.it
1. jQuery e i suoi plugin Pasquale Puzio 26 Maggio 2011, Bologna
2. Agenda Fondamenti di jQuery jQuery DOM & CSS Ajax & Gestionedeglieventi Animazioni Plugin RICH Internet (Web) Application DEMO ‘All in one’
3. Fondamenti di jQuery jQuery è unalibreria/framework open-source per Javascriptconcepita per semplificarenotevolmente e cambiareradicalmenteilmodo di programmare in Javascript
4. Perché scegliere jQuery GRATIS Semplicità Piena compatibilità Cross-Browser:IE 6+, FireFox 2+, Safari 3+, Opera 9+, Chrome Documentazione Community di supporto Quantità enorme di plugin Integrazione con i principali IDE tra cui Visual Studio
5. Perché scegliere jQuery Perché è meglio di questo: function assegnaXMLHttpRequest() { var XHR = null; browserUtente= navigator.userAgent.toUpperCase(); If (typeof(XMLHttpRequest) === "function" || typeof(XMLHttpRequest) === "object") XHR = new XMLHttpRequest(); else if( window.ActiveXObject&& browserUtente.indexOf("MSIE 4") < 0 ) { If (browserUtente.indexOf("MSIE 5") < 0) XHR = new ActiveXObject("Msxml2.XMLHTTP"); else XHR = new ActiveXObject("Microsoft.XMLHTTP"); } return XHR; }
9. Filosofia di jQuery Per accedere agli elementi del DOM si utilizzano i selettori CSS I selettori restituiscono un’istanza di jQuery sulla quale è possibile eseguire alcune azioni (manipolazione del DOM, CSS, gestione degli eventi, chiamate Ajax, ecc.)
10. Filosofia di jQuery Funzione principale: jQuery() Alias: $() Selezione Azione
11. DOM & CSS (Selettori) $("#ID") // id $("div") // div tag name $('[name*="value"]') // name contains $('[name^="value"]') // name start $(".myCssClass") // css class name $("form input") // descendant(s) $("#main > div") // child(s) $("#main ~ div") // sibling(s) $("input[name='radio']:checked") // radio checked $("td:first-child a") //<a> in first td $("input:disabled") // disabled input a[href^="http://"] // external links
19. Plugin Innumerevoli plugin per qualsiasi esigenza Animazioni (slideshow, carousel, ecc.) User Interface Rich Internet (Web) Application E’ facile sviluppare un plugin E’ facile utilizzare un plugin <script src=‘jquery.js’ type=‘text/javascript’></script> <script src=‘myplugin.js’ type=‘text/javascript’></script>
20. Plugin (Template) Sviluppato da Microsoft Permette a partire da strutture dati Javascript di generare codice HTML mediante l’uso di Template
26. Per iniziarea sviluppare Visual Studio Express 2010 o Visual Studio 2010 Professional (MSDN Academic Alliance): http://www.microsoft.com/express/Web/ Eclipse + plugin Aptana: http://www.aptana.com/