Please enable JavaScript.
Coggle requires JavaScript to display documents.
Javascript Programming (Advance Javascript Features (ES6/TS) (Type…
Javascript Programming
JQuery ($)
Content Manipulation
-
-
$("selector").append("newContent") - inside tag, at end
$("selector").prepend("newContent") - inside tag, at front
-
-
-
-
-
-
-
$("selector").replaceWith("content") - see above, content can be a callback function
-
Attribute Manipulation
$("a").attr("target", "_blank") - add attribute, open in new tab
$("img").attr({ src: "image.jpg", title:"IMAGE"}) - add attrib using object
-
Selector Filters
-
-
-
-
:gt(), :lt(), eq() - greater than, less than, equal
-
-
-
-
-
-
-
Animation Effects
$("selector").show(optionalTime, optionalEffect);
$("selector").hide(optTime, optEffect);
$("selector").toggle("slow", completionFn);
-
-
$("selector").fadeTo(optTime, optOpacity, completionFn)
$("selector").slideUp(optTime, effect, completionFn)
$("selector").slideDown(optTime, effect, completionFn)
$("selector").slideToggle(optTime, effect, completionFn)
-
Events
Main Method
$("selector").on(events [, selector filter][,data], handlerFn)
$("selector").off( events [, selector filter ] [, handler ] )
Form Events (shortcuts)
.blur( [eventData ], handler )
.change( [eventData ], handler )
.focus( [eventData ], handler )
.focusin( [eventData ], handler )
.focusout( [eventData ], handler )
.select( [eventData ], handler )
.submit( [eventData ], handler )
Mouse Events (shortcuts)
.click( [eventData ], handler )
.contextmenu( [eventData ], handler )
.dblclick( [eventData ], handler )
.hover( handlerIn, handlerOut )
.mousedown( [eventData ], handler )
.mouseup( [eventData ], handler )
.mousemove( [eventData ], handler )
.mouseenter( [eventData ], handler )
.mouseover( [eventData ], handler )
.mouseleave( [eventData ], handler )
.mouseout( [eventData ], handler )
.toggle( handler, handler [, handler ] )
-
AJAX
-
-
-
-
-
-
-
-
$.ajax( url [, settings ] ) - basic method, shortcuts below
$.get( url [, data ] [, success ] [, dataType ] )
$.getJSON( url [, data ] [, success ] )
$.getScript( url [, success ] )
$.post( url [, data ] [, success ] [, dataType ] )
$.load( url [, data ] [, complete ] )
-
-
Intermediate Javascript
-
-
Common Built-In Objects
-
JSON Object: parse(), stringify()
-
-
Promise Object: (resolve, reject)=>{}.then().catch().
Generator Object: next(),return(), throw()
Function Object: apply(), call(), bind()
-
-
-