Learn JavaScript Online | Free Interactive JavaScript Tutorials

What is JQuery?

Liew Voon Kiong — Sun, 17 Jun 2018 09:54:46 +0000

jQuery is a JavaScript library that lets you search for elements in a web document using CSS-style selectors and then performing the elements using certain methods. The purpose of jQuery is to make it much easier to use JavaScript on your website. Besides that, jQuery simplifies a lot of the complicated things from JavaScript, like AJAX calls and DOM manipulation.

We can create a jQuery function using the $() symbol, as follows:

$(‘li.popular‘)

This is a CSS-style selector where it finds all the

elements with a class of popular.

The jQuery has many methods that we can use to work with the elements we have selected.

For example. we can use the addClass method

Creating a Blockchain using JavaScript

Liew Voon Kiong — Sun, 08 Apr 2018 12:09:27 +0000

Cryptocurrency is a hot topic nowadays, especially since the value of Bitcoin has skyrocketed in the past two years. Though it is a volatile investment, many people still go for it.

Equally popular topic is the technology behind the cryptocurrency, i.e. the Blockchain. The appeal of the blockchain is that it can be applied to other industries other than cryptocurrency. The blockchain is a distributed ledger technology that provides a way to record and transfer data that is transparent, safe, auditable, and resistant to outages. The blockchain has the ability to make the organizations that use it transparent, democratic, decentralized, efficient, and secure.

In this article, we are keen to explore how JavaScript can be used to create a blockchain. There are many programming languages that are suitable to be used to write blockchain script, among them, VB.Net, Java, C++, Python, Solidity and of course, JavaScript.

The post Creating a Blockchain using JavaScript appeared first on Learn JavaScript Online | Free Interactive JavaScript Tutorials.

Creating Animation in JavaScript

Liew Voon Kiong — Thu, 14 Sep 2017 10:10:52 +0000

You can create an animation in JavaScript easily using the

setInterval method, the syntax is as follows:

myVariable=setInterval(myfunction, time interval)

The setInterval method runs a function created by you at a certain time interval in milliseconds. For example, a time interval of 1000 equals to 1 second.

Here are some examples of animations created by us:

The post Creating Animation in JavaScript appeared first on Learn JavaScript Online | Free Interactive JavaScript Tutorials.

The fromCharCode() Method

Liew Voon Kiong — Fri, 21 Jul 2017 02:39:41 +0000

The fromCharCode() Method is a method that belongs to the String object in JavaScript. It converts a Unicode into a corresponding character. You can refer to the Unicode Table to look up for a certain Unicode for a certain character or symbol. For example, The character of Unicode 78 is N.

Follow our JavaScript Tutorial Lesson 11 to learn more about the fromCharCode() Method

The post The fromCharCode() Method appeared first on Learn JavaScript Online | Free Interactive JavaScript Tutorials.

Drawing a Quadratic Curve

Liew Voon Kiong — Sat, 15 Jul 2017 04:18:54 +0000

To draw a quadratic curve, we use the quadraticCurve() method. However, we need to combine the quadraticCurve() method with the beginPath() and moveTo() methods in order to draw a quadratic curve. The beginPath() and moveTo() methods define the starting point of the quadratic curve. The quadraticCurve() method is to define the lowest point to the end point of the quadratic curve. The syntax of the quadraticCurve() method is

Please follow the following link to learn more.

Drawing a Quadratic Curve

The post Drawing a Quadratic Curve appeared first on Learn JavaScript Online | Free Interactive JavaScript Tutorials.

Pythagoras Theorem

Liew Voon Kiong — Fri, 14 Jul 2017 03:52:44 +0000

Pythagoras Theorem is used to solve problems related to the length of the sides of a triangle.
The formula to is

AB²+AC²=BC²

AB is the opposite side, AC is the adjacent and BC is the hypotenuse of a triangle ABC.

We shall create a JavaScript application to deal with problems related to Pythagoras Theorem. In this application, we shall insert two input boxes for the user to key in the length of the opposite side and the length of the adjacent side. The user can then click on the Calculate Hypotenuse button to find the answer.

BMI Calculator

Liew Voon Kiong — Wed, 17 Aug 2016 09:00:32 +0000

You can create a BMI calculator using JavaScript. The formula for BMI(Body Mass Index) is as follows:

BMI=weight/(height)^2

where weight is in kg and height in cm.

In the html page, you can create three text box using the tag to accept the user inputs for name, height and weight.

In the JavaScript, you can create a function to calculate the bmi, as follows:

function bmi(){

var sheight=parseFloat(document.getElementById(‘hgt’).value);
var sweight=parseFloat(document.getElementById(‘wgt’).value);
var bmi=sweight/Math.pow(sheight,2);
var student_bmi=document.getElementById(‘bmi_index’);
student_bmi.textContent=bmi.toFixed(2);
}

toFixed method is to round the output to 2 decimal ppalces

The html document is

Student Name=

Height=

Weight=

BMI=

Click here to launch the BMI calculator

The post BMI Calculator appeared first on Learn JavaScript Online | Free Interactive JavaScript Tutorials.

Creating a math drill for calculating volume of a cuboid

Liew Voon Kiong — Mon, 25 Jul 2016 03:48:20 +0000

We have learned how to create a calculator that calculates the volume of a cuboid. Using the similar script, we can write a JavaScript that allows the user to input the dimensions as well as enter the answer. If the answer is wrong, it will displays the “Incorrect” message, otherwise it will show the “Correct” message.

The JavaScript is as follows:’

function Calvol(width, length, height){
var vol=width*length*height;
return vol;
}
function CalSize(){
var x=parseInt(document.getElementById(“wdt”).value);
var y=parseInt(document.getElementById(“lgt”).value);
var z=parseInt(document.getElementById(“hgt”).value);
var Size=Calvol(x,y,z);
var answer=document.getElementById(‘ans1’).value;
if (answer==Size)
{message=”Correct”;}

else
{message=”Incorrect, try again”;}

document.getElementById(‘ans’).textContent=message;

}

And the html is as follows:

Volume Calculation

Volume of a Cuboid

Width =

Length=

Height=

The Volume is

Click Here to run the script.

The post Creating a math drill for calculating volume of a cuboid appeared first on Learn JavaScript Online | Free Interactive JavaScript Tutorials.

Creating a function that calculates the volume of a cuboid

Liew Voon Kiong — Sat, 23 Jul 2016 13:24:03 +0000

We have learned how to create a function that have arguments. In this example, we shall show you how to create a function that calculated the volume of cuboid give the width, length and height of the cuboid.

The JavaScript function to calculate the volume is

function Calvol(width, length, height){
var vol=width*length*height;
return vol;
}

The JavaScript function to call the Calvol() function by replacing the parameters with the arguments generate by the HTML document is

function CalSize(){
var x=parseInt(document.getElementById(“wdt”).innerHTML);
var y=parseInt(document.getElementById(“lgt”).innerHTML);
var z=parseInt(document.getElementById(“hgt”).innerHTML);
var Size=Calvol(x,y,z);
document.getElementById(‘ans’).textContent=”The Volume is= “+Size;
}

The HTML document is

Volume Calculation

Width=

Length=

Height=

What is the Volume?

Click Here to check it out

The post Creating a function that calculates the volume of a cuboid appeared first on Learn JavaScript Online | Free Interactive JavaScript Tutorials.

Adding arguments to a JavaScript function

Liew Voon Kiong — Thu, 21 Jul 2016 08:18:37 +0000

You can create a function in JavaScript and add arguments to it. An argument is one or more variables that are declared within the parenthesis of a function definition. The syntax is

function MyFunction(x,y,z)

{ statements;}

You can also use the return keyword to return a value to the statement.

function MyFunction(x,y,z)

{ return value; }

Example:

function Area_Rect(width,length)

{ area=width*length;

return area;}

You can call the function by assigning values to the arguments, such as

document.write(Area_Rect(4,6));

0r alert (“The area of a rectangle is”+Area_Rect(4,6)

The area of the rectangle if width=4 and length=6 is:

Please follow Lesson 13 and Lesson 14 to learn more about function.

The post Adding arguments to a JavaScript function appeared first on Learn JavaScript Online | Free Interactive JavaScript Tutorials.