GV

GeezerVison

The World Wide Web, restored to 800 pixels of glory.

Home|About|Gaming cabinet|Archives|How it works|Starter sites

On this site

  • JavaScript "Hello World!" application

This view

  • Original page
  • New address

GeezerVison is showing www.tutorialrepublic.com — JavaScript Examples - Tutorial Republic

TutorialRepublic
HOME HTML5 CSS3 JAVASCRIPT JQUERY BOOTSTRAP5 v4.6 PHP7 SQL REFERENCES EXAMPLES FAQ SNIPPETS Online HTML Editor
WEB TUTORIALS
HTML Tutorial CSS Tutorial JavaScript Tutorial jQuery Tutorial Bootstrap Tutorial PHP Tutorial SQL Tutorial
PRACTICE EXAMPLES
HTML Examples CSS Examples JavaScript Examples jQuery Examples Bootstrap Examples PHP Examples
HTML REFERENCES
HTML Tags/Elements HTML Global Attributes HTML Event Attributes HTML Color Picker HTML Language Codes HTML Character Entities HTTP Status Codes
CSS REFERENCES
CSS At-rules CSS Properties CSS Animatable Properties CSS Color Values CSS Color Names CSS Web Safe Fonts CSS Aural Properties
PHP REFERENCES
PHP Array Functions PHP String Functions PHP File System Functions PHP Date/Time Functions PHP Calendar Functions PHP MySQLi Functions PHP Filters PHP Error Levels
Advertisements

JavaScript Examples

This section contains an extensive collection of practice examples demonstrating the various techniques and features of the JavaScript language in real action.

JavaScript Basic

  • JavaScript "Hello World!" application
  • Embedding JavaScript code in an HTML file
  • Calling an external JavaScript file in a HTML document
  • Insert JavaScript code inside HTML tag
  • Case sensitivity in JavaScript
  • JavaScript Single line comments
  • JavaScript Multi line comments
  • Creating variables in JavaScript
  • Declaring variables in JavaScript
  • Declaring multiple variables in at once JavaScript

JavaScript Generating Output

  • Writing into the browser console
  • Writing into an alert dialog box
  • Writing into the browser window
  • Problem with document.write() method
  • Writing into an HTML element

JavaScript Data Types

  • String data type
  • Number data type
  • Representing Infinity value
  • Representing Not-a-Number value
  • Boolean data type
  • Undefined data type
  • Null data type
  • Object data type
  • Object properties names without quotes
  • Array data type
  • Function data type
  • Passing a function as argument to other function
  • The typeof operator

JavaScript Operators

  • Arithmetic operators
  • Assignment operators
  • String operators
  • Increment decrement operators
  • Logical operators
  • Comparison operators

JavaScript Events

  • Attaching event handlers inline
  • Attaching event handlers in an external file
  • Handling the click event
  • Handling the contextmenu event
  • Handling the mouseover event
  • Handling the mouseout event
  • Handling the keydown event
  • Handling the keyup event
  • Handling the keypress event
  • Handling the focus event
  • Handling the blur event
  • Handling the change event
  • Handling the submit event
  • Handling the load event
  • Handling the unload event
  • Handling the resize event

JavaScript Strings

  • Creating strings in JavaScript
  • Using quotes inside a string
  • Escaping quotes inside a string
  • Using escape sequences
  • Get the length of a string
  • Find the position a substring within a string
  • Find the position of last occurrence of a substring within a string
  • Find the position of a substring within a string from specific index
  • Search text or pattern inside a string
  • Slice out a portion of a string
  • Slice strings using negative indexes
  • Extract substring from a string
  • Extract fixed number of characters from a string
  • Replace part of string with another string
  • Find and replace text in a string case insensitively
  • Replace all occurrences of a substring in a string
  • Convert a string to uppercase characters
  • Convert a string to lowercase characters
  • Join two or more strings
  • Extract a single character from a string
  • Extract a single character from a string using square brackets
  • Split a string into an array
  • Split a string into an array of characters

JavaScript Numbers

  • Representing numbers in JavaScript
  • Representing numbers in exponential notation
  • Representing numbers in hexadecimal notation
  • Adding numbers and strings
  • Automatic conversion of numeric strings to numbers
  • Performing mathematical operation on non numeric values
  • Adding floating point numbers
  • Fixing roundoff error
  • Precision problem with integers
  • Parse integers from strings
  • Parse floating point numbers from strings
  • Convert numbers to strings
  • Format a number in exponential notation
  • Format numbers to fixed decimal places
  • Format numbers with precision
  • Largest and smallest possible pumbers

JavaScript If...Else and Switch Statements

  • JavaScript if statement
  • JavaScript if...else statement
  • JavaScript if...elseif...else statement
  • JavaScript switch...case statement
  • JavaScript switch...case statement with default clause on top
  • Combine multiple cases in a switch case statement
  • Typical conditional statement
  • Ternary operator

JavaScript Arrays

  • Storing single value in a variable
  • Creating arrays in JavaScript
  • Access individual elements of an array
  • Get the length of an array
  • Loop through an array using for loop
  • Loop through an array using for of loop
  • Loop through an array using for in loop
  • Add a new element at the end of an array
  • Add a new element at the beginning of an array
  • Add multiple elements to an array at once
  • Remove the last element from an array
  • Remove the first element from an array
  • Add or remove array elements at any index
  • Join all elements of an array into a string
  • Convert an array into a comma separated string
  • Extract out a portion of an array
  • Extract all elements from an array beyond specific index
  • Merge two arrays together into a single array
  • Merge multiple arrays into a single array
  • Search an array for a specific value
  • Search an array for a specific value beyond certain index
  • Find whether an array includes a certain value
  • Search an array based on certain condition
  • Search an array based on certain condition and find index
  • Filter an array in JavaScript

JavaScript Sorting Arrays

  • Sort an array alphabetically in JavaScript
  • Reverse the order of an array
  • Sort a numeric array in JavaScript
  • Sort a numeric array correctly using compare function
  • Find the maximum and minimum value in an array
  • Sort an array of objects

JavaScript Loops

  • JavaScript while loop
  • JavaScript do...while loop
  • JavaScript for loop
  • Iterate over an array using for loop
  • JavaScript for...in loop
  • Iterate over an array using for in loop

JavaScript Functions

  • Define and call a function in JavaScript
  • Add parameters to a function
  • Pass arguments to a function
  • Return a value from a function
  • Return multiple values from a function
  • JavaScript function expression
  • Assign a function to a variable
  • JavaScript function declaration vs function expression
  • JavaScript local variable
  • JavaScript global variable

JavaScript Objects

  • Creating objects in JavaScript
  • Quoting property names of an object
  • Get properties values of an object
  • Access properties of an object using bracket notation
  • Dynamically access object properties using variables
  • Loop through an object in JavaScript
  • Set the properties of an object
  • Remove properties from an object
  • Call the methods of an object
  • JavaScript copy by value
  • JavaScript copy by reference

JavaScript DOM Selectors

  • Select HTML head and body elements
  • Access body element from different location
  • Select an element by its id attribute
  • Select elements by class name
  • Select elements by tag name
  • Select elements with css selectors

JavaScript DOM Styling

  • Add inline styles to an element
  • Get style information from an element
  • Get computed style information from an element
  • Add or replace css classes on an element
  • Add or remove css classes on an element using classlist

JavaScript DOM Get Set Attributes

  • Get the value of an attribute
  • Set an attribute on an element
  • Remove an attribute from an element
  • Change the value of an attribute

JavaScript DOM Manipulation

  • Insert new element into the DOM
  • Insert new element at the beginning
  • Get set inner HTML of an element
  • Insert HTML without replacing the existing content
  • Remove an element from the DOM
  • Remove child element without knowing its parent
  • Replace an element with another element in the DOM

JavaScript DOM Navigation

  • Get first and last child nodes
  • Get only element child nodes
  • Get all child nodes
  • Get all element child nodes
  • Get parent node
  • Get only parent element node
  • Get previous and next node
  • Get previous and next sibling element

JavaScript Window

  • Get browser viewport dimensions
  • Get width and height of the browser viewport excluding scrollbars
  • Get screen resolution
  • Get available width and height of the screen
  • Get color depth of the screen
  • Get pixel depth of the screen

JavaScript Window Location

  • Get the current url
  • Get the different parts of a url
  • Load another resource from a url
  • Replace current url with a new url
  • Load new document in the window
  • Reload a page dynamically

JavaScript Dialog Boxes

  • Alert popup box
  • Confirm popup box
  • Prompt popup box

JavaScript Timers

  • Execute a function after some time
  • Execute a function at regular intervals
  • Cancel a timer with cleartimeout
  • Cancel a timer with clearinterval

JavaScript Date and Time

  • Create a date object in JavaScript
  • Passing parameters to the date object
  • Construct a date object by passing a date string
  • Define a date object by passing the number of milliseconds
  • Get the current date and time in JavaScript
  • Generate date strings in JavaScript
  • Generate time strings in JavaScript
  • Get year month and day from a date object
  • Get hours minutes and seconds from a date object
  • Set the year value of a date object
  • Set the month value of a date object
  • Specify the month value outside of the range
  • Set the date value of a date object
  • Specify the date value outside of the range
  • Set the hours minutes and seconds values of a date object

JavaScript Math Operations

  • Representing PI (π) in JavaScript
  • Get the absolute value of a number
  • Generate a random integer
  • Calculate the square root of a number
  • Round a number up in JavaScript
  • Round a number down in JavaScript
  • Round a number to the nearest integer
  • Find the largest and smallest numbers in a set
  • Find the maximum and minimum values in an array
  • Pass an array to max and min methods using spread operator
  • Raise a number to a certain power
  • Perform trigonometric operations in JavaScript

JavaScript Type Conversions

  • Automatic data type conversions
  • Convert a numeric string to number
  • Convert values to numbers
  • Convert a boolean value to string
  • Convert values to strings
  • Convert a number to string
  • Convert values to boolean
  • Automatic object to primitive data type conversions
  • Convert objects to primitive data types manually
  • Perform data type conversions using operators

JavaScript Event Listeners

  • Assigning multiple event handlers on a single event
  • Assigning multiple event listeners on a single event
  • Attaching different event listeners to different event types
  • Adding event listener to the window resize event
  • Removing an event listener

JavaScript Event Propagation

  • Event capturing mechanism
  • Event bubbling mechanism
  • Get the event target
  • Event propagation in JavaScript
  • Stop event propagation
  • Stop immediate propagation of an event
  • Prevent default actions with JavaScript

JavaScript Borrowing Methods

  • Call methods from other object
  • Apply methods of another object
  • Apply built in methods
  • Using spread operator instead of apply method
  • Find max or min value in an array using reduce method

JavaScript Hoisting

  • Function hoisting in JavaScript
  • Using a variable before it is declared
  • Using a variable before it is initialized
  • Variable hoisting in JavaScript

JavaScript Strict Mode

  • Enable strict mode in JavaScript
  • Enable strict mode inside the function
  • Cannot assign to undeclared variable in strict mode
  • Cannot delete a variable in strict mode
  • Cannot delete a function in strict mode
  • Duplicate parameter name not allowed in strict mode
  • Eval cannot alter scope in strict mode
  • Eval and arguments cannot be used as identifier in strict mode
  • Strict mode code may not contain with statements
  • Cannot assign to read only property of object in strict mode
  • Cannot add property to a non extensible object in strict mode
  • Octal literals are not allowed in strict mode

JavaScript JSON Parsing

  • JSON object data structure
  • JSON array data structure
  • Convert JSON string to JavaScript object and access individual values
  • Parse nested JSON data in JavaScript
  • Convert JavaScript object to JSON string
  • Convert JavaScript array to JSON string

JavaScript ES6 Features

  • ES6 let keyword
  • ES6 const keyword
  • ES6 constants are not truly immutable
  • ES6 for...of loop
  • ES6 template literals
  • Creating multi line strings in older versions
  • ES6 function with default parameter values
  • Setting default values for function parameters in older versions
  • ES6 arrow functions
  • ES6 arrow function variations
  • The this keyword value inside a simple function
  • The this keyword value inside an arrow function
  • ES6 class declaration
  • ES6 module system
  • ES6 rest parameter
  • ES6 get extra function arguments with rest parameter
  • ES6 spread operator
  • ES6 insert array elements into another array using spread operator
  • Accessing individual array elements in older versions
  • ES6 array destructuring assignment
  • ES6 using rest operator in array destructuring assignment
  • Accessing object property values in older versions
  • ES6 object destructuring assignment
Previous Page Next Page
Advertisements
Bootstrap UI Design Templates Property Marvels - A Leading Real Estate Portal for Premium Properties
Advertisements

Is this website helpful to you? Please give us a like, or share your feedback to help us improve. Connect with us on Facebook and Twitter for the latest updates.

About Us

Our Story Terms of Use Privacy Policy

Contact

Contact Us Report Error Guest Posts Advertise

Interactive Tools

Bootstrap Icon Search Utility HTML Formatter Title & Meta Length Calculator HTML Color Picker Bootstrap Button Generator SQL Playground Font Awesome Icon Finder HTML Editor

TutorialRepublic

BMC
Copyright © 2026 Tutorial Republic. All Rights Reserved.
Share This:
You are visitor 01402503 — GeezerVison does not store the pages you look up.
Best viewed with Netscape Navigator 4.7 or Internet Explorer 6 at 800×600. No cookies required.