2 JavaScript Quiz Test
| |
9 JSONP
| |
10 JSON HTML
| |
11 JSON PHP
| |
13 JSON.parse()
| |
14 JSON Arrays
| |
15 JSON Objects
| |
17 JSON vs XML
| |
18 JSON Syntax
| |
Saturday, April 28, 2018
JavaScript Introduction
JavaScript Introduction
This page contains some examples of what JavaScript can do.
JavaScript Can Change HTML Content
One of many JavaScript HTML methods is getElementById().
This example uses the method to "find" an HTML
element (with id="demo") and changes the element content (innerHTML)
to "Hello JavaScript":
Example
document.getElementById("demo").innerHTML
= "Hello JavaScript";
»
With HTML and JavaScript you can use single or double quotes:
Example
document.getElementById('demo').innerHTML = 'Hello
JavaScript';
»
JavaScript Can Change HTML Attributes
This example changes an HTML image by changing the src
(source) attribute of an <img> tag:
The Light Bulb
Turn on the light Turn
off the light
»
JavaScript Can Change HTML Styles (CSS)
Changing the style of an HTML element, is a variant of
changing an HTML attribute:
Example
document.getElementById("demo").style.fontSize
= "25px";
or
document.getElementById('demo').style.fontSize
= '25px';
»
JavaScript accepts both double and single quotes
JavaScript Can Hide HTML Elements
Hiding HTML elements can be done by changing the display
style:
Example
document.getElementById("demo").style.display
= "none";
or
document.getElementById('demo').style.display =
'none';
»
JavaScript Can Show HTML Elements
Showing hidden HTML elements can also be done by changing the
display style:
Example
document.getElementById("demo").style.display
= "block";
or
document.getElementById('demo').style.display =
'block';
JavaScript Quiz Test
JavaScript
Quiz Test
You can test
your JavaScript skills with Omegas' Quiz.
The Test
The test
contains 25 questions and there is no time limit.
The test is
not official, it's just a nice way to see how much you know, or don't know,
about JavaScript.
Count Your
Score
You will get
1 point for each correct answer. At the end of the Quiz, your total score will
be displayed. Maximum score is 25 points.
Start the
Quiz
Good luck!
Start the
Quiz
Omegas'
Online Certification
The perfect
solution for professionals who need to balance work, family, and career
building.
More than 10
000 certificates already issued!
Get Your
Certificate »
The HTML
Certificate documents your knowledge of HTML.
The CSS
Certificate documents your knowledge of advanced CSS.
The
JavaScript Certificate documents your knowledge of JavaScript and HTML DOM.
The jQuery
Certificate documents your knowledge of jQuery.
The PHP
Certificate documents your knowledge of PHP and SQL (MySQL).
The XML
Certificate documents your knowledge of XML, XML DOM and XSLT.
The
Bootstrap Certificate documents your knowledge of the Bootstrap framework.
JavaScript Browser Objects Examples
JavaScript
Browser Objects Examples
Examples of
using JavaScript to access and manipulate the Browser objects.
Window
Object
Open a new
window when clicking on a button
Open a new
window and control its appearance
Blur and
Focus a new window
Close the
new window
Checks
whether the new window has been closed or not
Write some
text to the source (parent) window
Move the new
window relative to its current position
Move the new
window to the specified position
Print the
current page
Resize a
window by the specified pixels
Resize a
window to a specified size
Scroll the
content by the specified number of pixels
Scroll the
content to a specified position
Window
explained
Screen
Object
The
visitor's screen: Width
The
visitor's screen: Height
The
visitor's screen: Available Width
The
visitor's screen: Available Height
The
visitor's screen: Color Depth
The
visitor's screen: Pixel Depth
Screen
explained
Location
Object
Return the
hostname and port of the current URL
Return the
entire URL of the current page
Return the
path name of the current URL
Return the
protocol portion of the current URL
Load a new
document
Replace the
current document
Break out of
a frame
Location explained
History
Object
Display the
number of URLs in the history list
Create a
back button on a page
Create a
forward button on a page
Load a
specific URL from the history list
History
explained
Navigator
Object
Is cookies
enabled in the visitor's browser?
What is the
name of the visitor's browser?
What is the
engine name of the visitor's browser?
What is the
version information of the visitor's browser?
What is user
agent information of the visitor's browser?
What is the
platform of the visitor's browser?
What is the
language of the visitor's browser?
Is Java
enabled in the visitor's browser?
Navigator
explained
Popup Boxes
Display an
alert box
Demonstrate
line breaks in an alert box
Display a
confirm box
Display a
prompt box
Popup
explained
Timing
Simple
timing
Another
simple timing
Timing event
in an infinite loop
Timing event
in an infinite loop - with a Stop button
A clock
created with a timing event
Set and stop
a timer with setInterval() and clearInterval()
Timing
explained
Cookies
Create a
welcome cookie
Cookies
explained
JavaScript HTML DOM Events Examples
JavaScript
HTML DOM Events Examples
Examples of
using JavaScript to react to events
Input Events
onblur -
When a user leaves an input field
onchange -
When a user changes the content of an input field
onchange -
When a user selects a dropdown value
onfocus -
When an input field gets focus
onselect -
When input text is selected
onsubmit -
When a user clicks the submit button
onreset -
When a user clicks the reset button
onkeydown -
When a user is pressing/holding down a key
onkeypress -
When a user is pressing/holding down a key
onkeyup -
When the user releases a key
onkeyup -
When the user releases a key
onkeydown vs
onkeyup - Both
Mouse Events
onmouseover/onmouseout
- When the mouse passes over an element
onmousedown/onmouseup
- When pressing/releasing a mouse button
onmousedown
- When mouse is clicked: Alert which element
onmousedown
- When mouse is clicked: Alert which button
onmousemove/onmouseout
- When moving the mouse pointer over/out of an image
onmouseover/onmouseout
- When moving the mouse over/out of an image
onmouseover
an image map
Click Events
Acting to
the onclick event
onclick -
When button is clicked
ondblclick -
When a text is double-clicked
Load Events
onload -
When the page has been loaded
onload -
When an image has been loaded
onerror -
When an error occurs when loading an image
onunload -
When the browser closes the document
onresize -
When the browser window is resized
Others
What is the
keycode of the key pressed?
What are the
coordinates of the cursor?
What are the
coordinates of the cursor, relative to the screen?
Was the
shift key pressed?
Which event
type occurred?
Examples
explained
