Learn JavaScript without HTML and CSS

If you want to learn JavaScript without HTML and CSS, then you have come to the Right Place. Yes you can learn JavaScript without knowing much about other Language like HTML,CSS or PHP.
Because HTML is a Markup Language, CSS is a Style Sheets Language and JavaScript is a interpreted, object-oriented Language.
Which means that Even if you know nothing About HTML and CSS you can Learn JavaScript.

learn JavaScript without HTML and CSS

JavaScript Tags:

We have to use JavaScript’s <script></script> tags to include JavaScript code inside HTML Document. Yes I know this tutorial is about leaning JavaScript without HTML and CSS, but we are only going to Include JavaScript inside HTML Web-page. So we can Run and Test out JavaScript in the Browsers.

Including JavaScript using <script> tag in HTML

To include JavaScript inside HTML Document we have to use HTML’s <script></script> Tags. Inside these Script’s Starting (<script>) and Closing (</script>) Tags we can write our JavaScript Code.

<script>
     //JavaScript Code here....
</script>

Hello Word in JavaScript

To Print Hello word or any other Line using JavaScript we have to use JavaScript’s document.write() Method. where inside the Round Brackets ( ) we have to write our Line/String which we want to Show as a Output in the Browser.
Make sure that you write your String or Line between these ("") Inverted Commas / Double quotes or JavaScript will Render your String value as an Veritable.

<script>
   document.write("hello World");
</script>

Variable in JavaScript

Variables in JavaScript can Hold Data and Return the assigned Data at the Time of Execution.
So if you have some Data (like String) that you have to write Again and Again, then you can store that Data in a Variable and you can call that variable whenever you need your Data.

Creating a Variable

To create a Variable in JavaScript you have to write var which stands for variable and after that You have to Give a name for your Variable.
The name of your variable can be anything but keep in mind you can not start a variable name with a Number.
You can add number after the Variable name like myVarible1 (Right)
but
You can not add a number Before your variable name like 1myVariable (Wrong).
After giving a name for your Variable you need to assign Data for your Variable.
If you are storing Numeric values in your Variable then you can assign your numeric values like this :
var myVaribale = 5;
but
If you are storing String Values (Like Name, Address, Text ETC) in your Variable then you can assign your String Values like this :
var myVaribale = “My Name is John”;

<script>
  var myName="John";
  var myAge=19;
</script>

Concatenation in JavaScript

Concatenation allow us to Joint Variable with Strings.
Like, I want to Write a Line which says “My Name is”. After that line “My Name is”. I will call my variable which stores my name and joint them both using JavaScript Concatenation Method.

<script>
  var name="John";
  document.write("My name is "+name);
</script>

JavaScript Alert Method

JavaScript Alert Method allow us to show a Alert box on our Web-page. Which is Sometime helpful, when you need to show something impotent on your Web-page [like Warnings ETC].

<script>
  alert("Hello");
</script>

JavaScript Console Logs

If you don’t want to show any Data from your website using alert() and document.write() methods. Then you can use JavaScript’s console.log() method, to show your Data in the Browser’s Console Tab.
(If you are unable to locate condole tab in your Browser the you have to Press ctrl+shif+i keys semimonthly to Show up console tab in your Screen).

<script>
  console.log("Working");
</script>

JavaScript Comments

These JavaScript Comments stops JavaScript Code from Executing at the time of Execution. Its hides the commented code/line, so the Commented data can’t effect the output Data.
(JavaScript Comments doesn’t work like usual comments where you can write something on someone’s Post).

Type of Comments in JavaScript

There are two types of Comments present in JavaScript.
Single-Line Comment
and
Double-Line Comment.

Single line Comment in JavaScript

Single line comment Hides a Single commented line at the time of Execution.
To add Single line comment in JavaScript we have to add Double Slashes ( // ) right at the Beginning at that line which we want to comment out.

<script>
  //alert("I am John");
  alert("I am Rick");
</script>

Multi-line Comment in JavaScript

Multi-line comment Hides multiple commented lines at the time of Execution.
To add Multi-line comment in JavaScript we have to add a single Slash with a asterisk sign ( /* ) at the Beginning and asterisk followed by a Slash at the End of those Multiple line that we want to comment out.

<script>
/*
  alert("line 1");
  alert("line 2");
  alert("line 3");
*/
alert("line 4");
</script>

JavaScript Arithmetic Operators

JavaScript Arithmetic Operators are used in numbers to perform a Arithmetic Operation on them.
Like Addition,
subtraction,
multiplication
and
Division.

<script>
  var a=2;
  var b=4;
  var add = a+b;
  var sub= a-b;
  var multi= a*b;
  var div= a/b;
</script>

JavaScript Functions

A JavaScript function is a block of Code designed to perform a particular task and a JavaScript function is executed when “something” invokes it or calls it.
You can run or Call a Function using JavaScript or by HTML’s onClick() Method.

function functionName(parameter1, parameter2) {
  // code to be executed
}

Calling a Function using JavaScript

To run/Call a JavaScript Function we have to call it by its name.
Just write function Name followed by round Brackets “ () “.

<script>
myFunction(); //calling JS Function
function myFunction(){ //Declaring JS Function
        alert("Working");
}
</script>

Calling a JavaScript Function using HTML

To run/Call a JavaScript Function using HTML we have to call it by HTML’s onClick Method.
Just write onClick method in HTML Element’s Starting tag with function Name followed by round Brackets “ () “.
Like : onClick=”functionName()”.

<html>
<body>
<button onClick="myFunction()"> Click Me </button>
</body>
</html>
<script>
function myFunction(){ 
        alert("Working");
}
</script>

Array in JavaScript

Arrays are used in JavaScript to store multiple values in a Single Variable.
So, instead of declaring multiple variables. We can use a Single variable and store them all in a Single Variable.

Without Using JS Array:

var student1="John";
var student2="Rick";
var student3="Mike";

with JavaScript Array

var students = ["John","Rick","Mike"];

By using Array in JavaScript we can store multiple Numeric and String value in a Single Variable. We just need to declare a Array Variable. Inside these Angle Brackets ( [ ] ) we have to write or assign values for our array.

Access the Elements of an Array in JavaScript

We can access an array element by using Array Index numbers. Where index value of an Array starts with 0. So if a write arrayName[0] this will return the first value from my array Variable.
arrayName[0] first value,
arrayName[1] second value,
arrayName[2] third value,
arrayName[3] forth value,
arrayName[4] fifth value.

<script>
var myArray = ["John","Rick","Mike"];
document.write( myArray[0] );
</script>

Random Numbers in JavaScript

By using Math.random() method we can generate Random Numbers using JavaScript.
We just have to write Math.random() and it will return a Random number. Whenever we run this Method.

<script>
  alert(Math.random());
</script>