Welcome to the Javascript Examples Page
This website houses useful Javascript examples and example code that can help you better understand how Javascript works and provide a more reliable space from where you can look up and learn code.
You can use the nav bar links to navigate through the website. However, a more thorough list of code and examples available right now can be found below:
- DOM Manipulation Examples
- Javascript Debugging
- Array Functions
- String Functions
- Events
- Types of Events
DOM Manipulation Examples
- DOM Events Example - An example showing how events function using an onblur event on an input tag.
- Changing Attributes - An example showing how Javascript can be used to change the attributes of DOM Elements.
- Changing Text - An example showing how Javascript can be used to change the inner text of DOM Elements.
- Dynamically Change Styles - An example showing how Javascript can be used to change the style of DOM Elements dynamically.
- Showing and Hiding Elements - An example showing how Javascript can be used to change to show and hide DOM Elements dynamically.
Javascript Debugging
- Alert Function - Description and Example code for the alert() function.
- Console.log Function - Description and Example code for the console.log() function.
Array Functions
- Join Function (Convert Array to String) - Description and Example code to convert arrays to strings with a specific delimiter using the join() functions.
- Merging Arrays (Array Concatenation) - Description and Example code to concatenate arrays using the concat() function.
- Adding and Removing elements from the end of an array - Description and Example code to add and remove elements from the end of an array using the push() and pop() functions.
- Adding and Removing elements to the front of an array - Description and Example code to code to add and remove elements to the front of an array using the unshift() and shift() functions.
- toString Function (Convert Array to String) - Description and Example code to convert arrays to strings with preset commas (between elements) using the toString() functions.
String Functions
- Case Conversion - Description and Example code to toggle between upper and lower casing for strings using toUpperCase() and toLowerCase functions.
- Extraction of Characters - Description and Example code to extract characters at positions using charAt(), charCodeAt() and Property Access ([]) functions.
- Occurence and Position of a substring in a string - Description and Example code to find the occurence and position of a substring in a string using the indexOf() and lastIndexOf() functions.
- String and Number Concatenation - Description and Example code to code to understand how strings and numbers are concatenated using the + operator.
- String Concatenation - Description and Example code to concatenate different strings using the + operator and the concat() function.
- String Extraction - Description and Example code to extract entire substrings from strings using the slice(), substring() and substr() functions.
- String Length - Description and Example code to find the length of a string using the length attribute.
- String Replacement - Description and Example code to replace parts of a string with other strings using the replace function.
- Trimming Strings - Description and Example code to remove extra space on the sides from strings (trim) using the trim() function.
Events
- What is an Event? - Description of what an event is and what event driven programming means
- Adding Event Listeners - Description and code to add event listeners on DOM Elements using the addEventListener() function.
- Removing Event Listeners - Description and code to remove event listeners on DOM Elements using the removeEventListener() function.
Types of Events
- Click Event - Description and code to better understand what "click" events are and how they work.
- Mouse Over and Mouse out Event - Description and code to better understand what "mouseover" and "mouseout" events are and how they work.