CHEAT SHEET

JAVASCRIPT WEB PROGRAMMING

Created by @Manz ( http://twitter.com/Manz ) http://www.emezeta.com/

window = Browser global object screen = info about screen / resolution performance = info about performance
PROPERTIES PROPERTIES PROPERTIES

b .closed check if window is closed n .availTop top-from space available o .navigation info about redir/type nav.
n .devicePixelRatio ratio vertical size pix n .availLeft left-from space available o .timing info about latency-load perf.
b .fullScreen check if window is fullscreen n .availWidth width space available METHODS
n .innerWidth width size (incl. scrollbar) n .availTop height space available n .now() high precision timestamp
n .innerHeight height size (incl. scrollbar) n .width screen width resolution
n .outerWidth width size (incl. browser) n .height screen height resolution navigator = info about browser
n .outerHeight height size (incl. browser) n .colorDepth screen color depth (bits) PROPERTIES

n .length number of frames n .pixelDepth screen pixel depth (bits) b .cookieEnabled browser cookies on?
s .name inner name of window METHODS n .doNotTrack DNT privacy enabled?
s .status bottom statusbar text b .lockOrientation(mode|modearray) o .geolocation user-info geolocation
API/OBJECTS PROPERTIES b .unlockOrientation() remove locks s .language language in browser
o .applicationCache ofine resources API n .maxTouchPoints max on device
o .console console browser API console = unofcial console browser API b .onLine browser work in online mode?
o .crypto cryptographic API METHODS s .userAgent identify browser of user
o .history session page history API .assert(cond, str1|obj1...) set a assert METHODS

o .location information about URL API .count(str) count (show number times) n .vibrate(n|pattern) use device vibration
o .localStorage storage for site domain .dir(obj) show object (expanded debug)
o .sessionStorage storage until closed .group() open new message group location = info about current URL
o .navigator information about browser .groupCollapsed() open new group coll. PROPERTIES

o .performance data about performance .groupEnd() close previous group s .href full document url
SCREEN PROPERTIES .table(array|obj, colnames) show table s .protocol https://www.emezeta.com/
.trace() show code trace s .username https://user:pass@www
o .screen information about screen
.timeStamp(str) put time on timeline s .password https://user:pass@www
n .screenX horizontal pos browser/screen
s .host https://emezeta.com:81/
n .screenY vertical pos browser/screen PERFORMANCE METHODS
s .hostname https://emezeta.com:81/
n .pageXOffset horizontal pixels scrolled .prole(name) start performance prole
s .port https://emezeta.com:81/
n .pageYOffset vertical pixels scrolled .proleEnd(name) stop perf. prole
s .pathname http://emezeta.com/42/
WINDOW PROPERTIES .time(name) start performance timer
s .hash http://emezeta.com/#contacto
o .opener window that opened this window .timeEnd(name) stop perf. timer
s .search http://google.com/?q=emezeta
o .parent parent of current window/frame LOG LEVEL METHODS
o .searchParams search params object
o .self this window (equal to .window) .log(str1|obj1...) output message s .origin source origin of document url
o .top top window of current win/frame .info(str1|obj1...) output information
METHODS .warn(str1|obj1...) output warning onClick="..." (HTML) .onclick = (JS func) 'click' (Listener)
s .btoa(str) encode string to base64 .error(str1|obj1...) output error e events (only popular events)
s .atob(str) decode base64 string to text MOUSE EVENTS
.focus() request send window to front window = global interaction func. e e
.onClick .onDblClick
.blur() remove focus from window METHODS
e .onMouseDown e .onMouseUp
USER INTERACTION METHODS
o .getSelection(id) return Selection object e .onMouseEnter e .onMouseLeave
.postMessage(msg, dst, transf) send .alert(str) show message (ok button) e .onMouseMove e .onMouseOver
o .open(url, name, options) open popup s .prompt(str, def) ask answer to user e e
.onMouseOut .onWheel
.stop() stop window loading b .conrm(str) show message (ok, cancel) KEYBOARD EVENTS
b .nd(str, case, back, wrap, word, fr, d) e .onKeyDown e .onKeyUp
.print() open print document window history = page history on tab e .onKeyPress
PROPERTIES
ANIMATION METHODS LOAD/OBJECT EVENTS
n .requestAnimationFrame(cb(n)) n .length number of pages in historytab
e .onDOMContentLoaded e .onLoad
n .state return state top history stack
.cancelAnimationFrame(reqID) e .onAbort e .onError
METHODS
TIMER METHODS e .onResize e .onScroll
n .setTimeout(f(a...), ms, a...) delay&run .back() go prev page (same as .go(-1)) e .onBeforeUnload e .onUnload
.clearTimeout(id) remove timeout .forward() go next page (same as .go(1)) FORM/FIELDS EVENTS

n .setInterval(f(a...), ms, a...) run every

.go(n) go n page (positive or negative) e .onBlur e .onFocus
.pushState(obj, title, url) insert state e .onChange e .onInput
.clearInterval(id) remove interval .replaceState(obj, title, url) repl. state e .onInvalid e .onSelect
SCREEN METHODS
e .onReset e .onSubmit
.scrollBy(x, y) scroll x,y pixels (relative) storage localStorage / sessionStorage ANIMATION/TRANSITION EVENTS
.scrollTo(x, y) scroll x,y pixels (absolute) PROPERTIES e .onDragEnter e .onDragLeave
.moveBy(x, y) move window by x,y (rel) n .length number of items in storage e .onDragStart e .onDragEnd
.moveTo(x, y) move window to x,y (abs) METHODS e .onDragOver e .onDrag e .onDrop
.resizeBy(x, y) resize win by x,y (rel) s .key(n) return key name on position n ANIMATION/TRANSITION EVENTS
.resizeTo(w, h) resize win to WxX (abs) s .getItem(key) return value of item key e .onAnimationStart e .onAnimationEnd
STYLESHEET METHODS
.setItem(key, value) set or update key e .onAnimationIteration e .transitionEnd
o .getComputedStyle(elem, pseudelem) .removeItem(key) delete item with key
a .matchMedia(mediaq) match CSSMQ .clear() delete all items for current site
 CHEAT SHEET

JAVASCRIPT WEB PROGRAMMING

Created by @Manz ( http://twitter.com/Manz ) http://www.emezeta.com/

document = Document object e Element() = Element object a Attr() = Attribute object

PROPERTIES PROPERTIES PROPERTIES

s .characterSet document charset s .accessKey if exist, shortcut key s .name name of element attribute
s .compatMode quirks or standard mode o .attributes array of Attr objects s .value value of element attribute
s .cookie return all cookies doc string o .classList DOMTokenList of classes
s .designMode return design mode status s .className classes list to string t DOMTokenList() = List of classes
s .dir return direction text: "rtl" or "ltr" s .id id string of element PROPERTIES

s .doctype return document type (DTD) s .name name string of element n .length number of items
s .domain return document domain s .tagName HTML tag of element METHODS
s .documentURI return document URL POSITION, SIZE AND SCROLL PROPERTIES b .contains(item) check if item exists
s .lastModied return date/time modic. n .clientTop top border width element .add(item) add item to list
s .origin return document's origin n .clientLeft left border width element s .item(n) return item number n
s .readyState return current load status n .clientWidth inner width element .remove(item) del item from list
s .referrer return previous page (referrer) n .clientHeight inner height element b .toggle(item) del item if exist, add else
s .title return document title n .scrollTop top-position in document
s .URL return HTML document URL n .scrollLeft left-position in document n Node() = Minor element (elem. or text)
o .location information about URL n .scrollWidth width of element PROPERTIES
ELEMENTS PROPERTIES n .scrollHeight height of element s .baseURI absolute base URL of node
o .activeElement focused element GET/SET HTML CODE PROPERTIES s .namespaceURI namespace of node
o .body return body element s .innerHTML get/set HTML inside elem s .nodeName name of node
o .currentScript return active script s .outerHTML get/set HTML (incl. elem) s .nodeType 1=element, 2=text, 9=doc
o .defaultView return window element METHODS
s .nodeValue value of node
o .documentElement rst element (root) s .prex namespace prex of node
o .head return head element
o .closest(selec) closest ancestor s
a .textContent text of node and children
o .scrollingElement rst scrollable elem. .getElementsByClassName(class)
NAVIGATION PROPERTIES
a .getElementsByTagName(tag)
DOCUMENT ARRAY PROPERTIES
o .querySelector(selec) return rst elem o .childNodes children nodes collection
a .anchors array of images elements a .querySelectorAll(selec) return elems o .rstChild rst children (include text)
a .applets array of applets elements b .matches(selec) match with this elem? o .lastChild last children (include text)
a .embeds array of embeds elements .insertAdjacentHTML(posstr, html) o .nextSibling immediate next node
a .forms array of forms elements ATTRIBUTE METHODS
o .previousSibling immediate prev node
a .images array of images elements o .parentElement immediate parent elem
b .hasAttributes() exists attributes?
a .links array of links elements o .parentNode immediate parent node
b .hasAttribute(name) exist attribute?
a .plugins array of plugins elements o .ownerDocument return document
s .getAttribute(name) return value
a .scripts array of scripts elements METHODS
STYLESHEET PROPERTIES
.removeAttribute(name) del attribute
.setAttribute(name, value) set attrib. o .appendChild(node) add node to end
a .styleSheets array of style les elem o .cloneNode(child) duplicate node
CLIENTRECT (POSITION AND SIZES) METHODS
o .preferredStyleSheetSet preferred css o .compareDocumentPosition(node)
o .selectedStyleSheetSet selected css o .getBoundingClientRect() return pos.
b .contains(node) node is descendant?
a .getClientRects() return pos/size array
METHODS b .hasChildNodes() node has childs?
o .adoptNode(node) adopt from ext doc o .insertBefore(newnode, node)
e Event() = Event on action
o .createAttribute(name) create Attr obj b .isDefaultNamespace(nsURI)
PROPERTIES
o .createDocumentFragment() b .isEqualNode(node) check if are equal
o .createElement(tag) create Element obj b .bubbles true=bubble, false=captures s .lookupNamespaceURI() ret namesp.
o .createEvent(type) create Event object b .cancelable event is cancelable? s .lookupPrex() return prex for a ns
o .createRange() create Range object o .currentTarget current element .normalize() normalize-form children
o .createTextNode(text) create TextNode b .defaultPrevented preventDefault() call o .removeChild(node) del node & return
o .enableStyleSheetsForSet(name) n .detail additional event info o .replaceChild(newnode, oldnode)
o .importNode(node, desc) import copy n .eventPhase current stage (0-3)
o .getElementById(id) nd elem with id b .isTrusted user action or dispatched c ChildNode()
a .getElementsByName(name) w/ name o .target reference to dispatched object METHODS

o .getSelection(id) return Selection object n .timeStamp time when was created o .remove() remove specied node
s .type type of event
r ClientRect() = Coords of element METHODS
p ParentNode()
PROPERTIES
PROPERTIES
.preventDefault() cancel event
n .top top coord of surrounding rect .stopImmediatePropagation() n .childElementCount number of children
n .right right coord of surrounding rect .stopPropagation() prevent being called o .children children elements
n .bottom bottom coord of surrounding r. o .rstElementChild rst children elem.
n .left left coord of surrounding rect o .lastElementChild last children elem.
t EventTarget (use over elements)
n .width width coord of surrounding rect
METHODS n NonDocumentTypeChildNode()
n .height height coord of surrounding r.
.addEventListener(ev, cb(ev), capt) PROPERTIES

.removeEventListener(ev, cb(ev), capt) o .nextElementSibling next element

b .dispatchEvent(ev) o .previousElementSibling prev element