Select Page

## JavaScript multiplication table

In this lesson we build in JavaScript a simple multiplication table.

To make this example, we will therefore create an html table and in each cell we will insert our elements.

Let’s go back to the example above to understand how to get the elements to be inserted in the cells:

From the figure we can therefore see that if we multiply the rows with the columns we will get the desired results.

In fact, int he firt row we have:

1*1=1; 1*2=2; 1*3=3,…

In the second line we will have instead:

2*1=2; 2*2=4; 2*3=6, ….

And so on for the other lines.

## JavaScript multiplication table – development

To create the multiplication table, for example of size 10 x 10, I therefore use two nested for loops with different indices.

Then, in each cell I display the product of the two indices i and j.

Below is the complete JavaScript code that we could insert into our HTML page:

``````
document.write('<table border="1">');
for(let i=1; i <= 10; i++) {
document.write('<tr>')
for(let j=1; j <= 10; j++) {
document.write('<td>' + i * j + '</td>');
}
document.write('</tr>');
}
document.write('</table>');
``````

For simplicity we are using the document.write method to print our multiplication table in JavaScript, but we could also use the methods to manipulate the DOM, having fun creating new elements.

The tutorial for manipulating DOM elements in JavaScript can be found at the following link: DOM in JavaScript.

## JavaScript multiplication table - second example

Here is an example of the Pythagorean Table implemented using the createElement() and createTexnode() methods.

Click on the add multiplication table button below, to bring up a 10 x 10 multiplication table.

Multiplication table procedure in JavaScript

The html code that I used to create the example is composed of a button and a div where to display the multiplication table.

``````

<div id="table"></div>

``````

The javascript code represents a function that inside it I create a table tag by setting the border attribute to 1.

Then using the two for loops I create the multiplication table where inside each cell I insert, as in the previous example, the product of the two indices.

Using the appendChild method I append all the elements in the html page.

Here is the complete code:

``````
var table = document.createElement("table");
table.setAttribute('border', 1)

for (let i=1; i <= 10; i++) {
var row = document.createElement("tr");
for (let j=1; j <= 10; j++) {
var col = document.createElement("td");
var text = document.createTextNode(i * j);
col.appendChild(text);
row.appendChild(col);
}
table.appendChild(row);
}
document.getElementById("table").appendChild(table);
}
``````

## Conclusion

In this lesson we have developed the JavaScript multiplication table using various methods.

JavaScript tutorial

JavaScript Calculator

Object in JavaScript

For in loop

Caesar cipher decoder

Slot Machine in JavaScript

Introduction to JavaScript language

Learn JavaScript – basic concepts

## prime number JavaScript

In this lesson we develop a prime number algorithm in JavaScript.

First of all, remember that a number is prime when it has two divisors, namely 1 and itself.

The sequence of prime numbers begins with 2, 3, 5, 7, 11, 13, 17, 19, 23, 29, 31, …

## prime number JavaScript – algorithm

Check if a number taken as input is prime.

To check if a number is prime, you need to use a divisor which is incremented by 1 from time to time.

So, I begin to divide the number taken as input, first by 1, then by 2, then by 3, etc.

Clearly in order to do this I have to use a loop, increasing the divisor by 1, after each iteration.

So if, for example, the number were 3 then I would first divide it by 1, then by 2 and then by 3. At the same time I can count the divisors using a special variable, for example named count.

If at the end we find 2 divisors, that is 1 and the number itself, the value of the variable count will be 2 and then the number is prime. Otherwise the number is not prime.

But we can do better. We can consider that the divisor can stop at half of the number itself as it is taken for granted that dividing a number by a value greater than its half you get a decimal number. So we can only count one divisor to define that a number is prime (if count wille be 1 the number is prime).

So here is a possible solution to the algorithm on prime number created in JavaScript:

``````
var n = prompt('Insert a number: ');
while (n < 0){
n = prompt('Insert a positive number: ');
}

var div = 1;
var count = 0;

while(count <= 1 && div <= n/2) {
if(n % div == 0)  {
count++;
}
div++;
}

if (count == 1){
document.write('The number is prime!');
}
else {
document.write('The number isn't prime!');
}
``````

In this algorithm we first checked that the user enters a positive number with a while loop, in the same way we could also use the do while.

The while condition we entered stops as soon as the variable count equals 1 and the divisor has reached half the number.

## Conclusion

Clearly this is just a possible solution to the prime number algorithm in JavaScript, please submit yours and let's discuss it in the comments below.

JavaScript tutorial

JavaScript Calculator

Object in JavaScript

For in loop

Caesar cipher decoder

Slot Machine in JavaScript

Introduction to JavaScript language

Learn JavaScript – basic concepts