Scribd
Upload
51 views

Cheat Sheet: Javascript

This document provides a cheat sheet summary of common JavaScript concepts and methods including: - DOM methods for manipulating HTML elements like getElementById() and getElementsByClassName() - Events like onclick and onkeyup that occur when elements are interacted with - Variables, arithmetic operators, and string functions - Conditional statements like if/else for different outcomes - Loops like for and while for repeating actions - Functions both regular and anonymous for reusable blocks of code

Uploaded by

Cyber Safety
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
51 views

Cheat Sheet: Javascript

This document provides a cheat sheet summary of common JavaScript concepts and methods including: - DOM methods for manipulating HTML elements like getElementById() and getElementsByClassName() - Events like onclick and onkeyup that occur when elements are interacted with - Variables, arithmetic operators, and string functions - Conditional statements like if/else for different outcomes - Loops like for and while for repeating actions - Functions both regular and anonymous for reusable blocks of code

Uploaded by

Cyber Safety
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 2

JavaScript element.

id
Cheat Sheet Returns or assigns an id to an element

element.class
OUTPUT Returns or assigns a class to an element
# This is a comment
/* This is a multi-line comment */ elementName.innerText = “Hello World”
Assigns text to an HTML element
window.alert(“Hello World”)
Displays “Hello World” in an alert box
EVENTS
Events occur only in certain circumstances; they’re
console.log(“Hello World”) generally associated with functions.

Writes “Hello World” into the browser console


document.onload
DOM METHODS Occurs when the web page is initially loaded
These methods affect the overall HTML page.
element.onclick
document.getElementById(“id”)
Occurs when the element is clicked
Returns the element where id = “id”

document.getElementsByClassName(“class element.onkeyup
”) Occurs when any key is pressed in the element
Returns a list of elements where class=”class”
VARIABLES
document.createElement(“button”) Variables must be declared before they are used.
Creates a button element var number = 1;
var workshop = “Advanced Web Dev”;
element.childNodes var even_numbers = [2, 4, 6, 8];

Returns all children elements within ‘element’


ARITHMETIC OPERATORS
element.parentNode + Add - Subtract * Multiply / Divide
Returns the predecessor of ‘element’ ++ Increase by one -- Decrease by one

STRING FUNCTIONS
element.appendChild
Adds a DOM element to ‘element’ var string = “javascript”;
string.length

element.removeChild(child_element) Returns 10 – the length of the string

Removes ‘child_element’ from ‘element’

JavaScript – Cheat Sheet Page 1 of 2


string.slice(0, 4) Multiple Selection
if (number > 0) {
Slices string from index 0 to index 4. alert(“Positive”);
Returns “java”
} else if (number < 0) {

string.replace(‘a’, ‘A’) alert(“Negative”);


} else {
Replaces first instance of ‘a’. alert(“Zero”);
Returns “jAvascript” }

CONDITIONAL STATEMENTS
LOOPS
Relational Operators
== Equal to != Not equal to Counted Loops
> Greater than < Less than for (i = 0; i < 5; i++) {
>= Greater than or equal to alert(i);
<= Less than or equal to }
This outputs the values 1-9.
Boolean Operators - evaluate to True or False
// Loop through an array
&& and
var even_numbers = [2, 4, 6, 8];
(1 > 0) && (4 > 0) for (i = 0; i < even_numbers.length; i++)
{
Evaluates to: True
alert(even_numbers[i]);
|| or }

(1 > 3) || (4 > 3) This all values stored in the array.

Evaluates to: True Conditional Loops


! not var i = 1;
while (i < 10) {
!(1 == 1) alert(i);
}
Evaluates to: False
This outputs the values 1-9
One Way Selection
if (name == “Sudo”) {
alert(“Hello Sudo”);
FUNCTIONS
}
// Function that adds two numbers
function add(number1, number2) {
return number1 + number2;
Two Way Selection
}
if (mark >= 50) { alert( add( 3, 4 ) )
alert(“Pass”);
Displays 7
} else {
alert(“Fail”);
} // Anonymous Functions Example
window.onload = function() {
alert(“Hello”);
}

This outputs “Hello” once the window is loaded,


and cannot be used any other time.

JavaScript – Cheat Sheet Page 2 of 2

You might also like