Wat is jQuery, wat kun je ermee en waarom moet jij het gebruiken?
Een korte presentatie voor mensen die nog geen kennis hebben van jQuery en het graag willen leren.
Sommige slides zijn van marcgrabanski.com
Credits gaan dus naar hem toe.
3. Wat is jQuery?
Bibliotheek
•
Klein en snel
•
Anima?es
•
AJAX
•
jQuery is gemaakt om JS code makkelijker te maken
•
Vereenvoudigt interac?e tussen HTML en JavaScript
•
4. Voorbeeld
if (!document.ELEMENT_NODE) { document._importNode = func?on(node, allChildren) {
switch (node.nodeType) {
document.ELEMENT_NODE = 1;
case document.ELEMENT_NODE:
document.ATTRIBUTE_NODE = 2;
var newNode = document.createElement(node »
document.TEXT_NODE = 3; .nodeName);
document.CDATA_SECTION_NODE = 4; /* does the node have any alributes to add? */
document.ENTITY_REFERENCE_NODE = 5; if (node.alributes && node.alributes »
.length > 0)
document.ENTITY_NODE = 6;
for (var i = 0; il = node.alributes.length; »
document.PROCESSING_INSTRUCTION_NODE = 7;
i < il)
document.COMMENT_NODE = 8;
newNode.setAlribute(node.alributes »
document.DOCUMENT_NODE = 9; .nodeName, node.getAlribute(node.alributes[i++] »
document.DOCUMENT_TYPE_NODE = 10; .nodeName));
/* are we going aser children too, and does »
document.DOCUMENT_FRAGMENT_NODE = 11;
the node have any? */
document.NOTATION_NODE = 12;
if (allChildren && node.childNodes && »
}
node.childNodes.length > 0)
for (var i = 0; il = node.childNodes.length; »
i < il)
newNode.appendChild(document._importNode »
(node.childNodes[i++], allChildren));
return newNode;
break;
case document.TEXT_NODE:
case document.CDATA_SECTION_NODE:
case document.COMMENT_NODE:
return document.createTextNode(node.nodeValue);
break;
}
};
JavaScript
19. jQuery selector
$(quot;#contentquot;) zoek element met id content
•
•
$(quot;li:firstquot;) zoek het eerste list item
•
•
$(quot;tr:oddquot;) zoek alle oneven genummerde tabelregels
•
•
$(quot;a[target=_blank]quot;) zoek alle links met target blank
•
• $(quot;form[id^=step]quot;) zoek alle forms waarvan de id begint
met step
Ga voor meer voorbeelden van ‘Selectors’ naar
hquot;p://codylindley.com/jqueryselectors/