Web Design என்றால் என்ன ?
Full Stack Web Development In Tamil
Electrical Machines Materials
http://www.mediafire.com/folder/qm6erekv0u5h5/ElectricalVehicle
First Program
<html>
<head>
<title>My first JavaScript Application</title>
</head>
<body>
<h1>Kaashiv First Application</h1>
<p id=”Javascriptvalue”></p>
<script>
document.getElementById(“Javascriptvalue”).innerHTML = “JavaScript Input Value”
</script>
</body>
</html>
//////////////////////////////////////////////////////////////////////////
Second Program
<html>
<head>
<title>My first JavaScript Application</title>
</head>
<body>
<h1>Kaashiv First Application</h1>
<p id=”Javascriptvalue”></p>
<script>
x=10;
y=20;
z=x+y;
document.getElementById(“Javascriptvalue”).innerHTML = “The value of z is “+z;
</script>
</body>
</html>
//////////////////////////////////////////////////////////////////////////////
Third Program
<html>
<head>
<title>My first JavaScript Application</title>
</head>
<body>
<h1>Kaashiv Third Application – JavaScript Object</h1>
<p id=”Javascriptvalue”></p>
<script>
var People =
{
name:”venkat”,
id:100,
age:27
};
document.getElementById(“Javascriptvalue”).innerHTML = “The Name is “+ People.name + ” and the id is ” + People.id + ” and the age is ” + People.age;
</script>
</body>
</html>
////////////////////////////////////////////////////////////////////
Fourth Program
<html>
<head>
<title>My first JavaScript Application</title>
</head>
<body>
<h1>Kaashiv Fourth Application – JavaScript Functions</h1>
<p id=”Javascriptvalue”></p>
<script>
var x = func(3,4);
document.getElementById(“Javascriptvalue”).innerHTML = “The value is “+ x;
function func( x , y)
{
return x+y;
}
</script>
</body>
</html>
///////////////////////////////////////////////////////////////////////////////////
Fifth Program
<html>
<head>
<title>My Fifth JavaScript Application</title>
</head>
<body>
<h1>Kaashiv Fifth Application – JavaScript Functions and Objects</h1>
<p id=”Javascriptvalue”></p>
<script>
var people =
{
Fname: “venkat”,
id:20,
age:27,
dataval : function() /******** dataval is a function *******/
{
return this.Fname;
}
};
document.getElementById(“Javascriptvalue”).innerHTML = “The value is “+ people.dataval();
</script>
</body>
</html>
/////////////////////////////////////////////////////////////////////////////
Sixth Program
<html>
<head>
<title>My Sixth JavaScript Application</title>
</head>
<body>
<h1>Kaashiv Sixth Application – JavaScript Strings</h1>
<p id=”JavaStringLength”></p>
<p id=”IndexOf”></p>
<p id=”lastIndexOf”></p>
<p id=”slice”></p>
<p id=”replaceString”></p>
<script>
val=’venkat’;
document.getElementById(“JavaStringLength”).innerHTML = “The length of the val is “+ val.length;
val1=’Welcome to kaashiv infotech to’;
document.getElementById(“IndexOf”).innerHTML = “The index of the val1 is “+ val1.indexOf(“to”);
val2=’Welcome to kaashiv infotech to’;
document.getElementById(“lastIndexOf”).innerHTML = “The index of the val1 is “+ val2.lastIndexOf(“to”);
val3=’Welcome to kaashiv infotech to’;
document.getElementById(“slice”).innerHTML = “The index of the val1 is “+ val3.substring(8,14);
val4=’Welcome to kaashiv infotech to’;
document.getElementById(“replaceString”).innerHTML = “The index of the val1 is “+ val4.replace(“to”,”the”);
</script>
</body>
</html>
//////////////////////////////////////////////////////////////////////////////
Seventh Program
<html>
<head>
<title>My Seventh JavaScript Application</title>
</head>
<body>
<h1>Kaashiv Seventh Application – JavaScript Arrays</h1>
<p id=”JavaArray1″></p>
<p id=”JavaArray2″></p>
<p id=”JavaArray3″></p>
<p id=”JavaArray4″></p>
<p id=”JavaArray5″></p>
<script>
var Names = [“venkat”, “krishiv”, “Arun”, “Banu”];
document.getElementById(“JavaArray1″).innerHTML = Names.join(” – “)
Names.pop();
document.getElementById(“JavaArray2″).innerHTML = Names.join(” / “)
Names.push(“asha”);
document.getElementById(“JavaArray3″).innerHTML = Names.join(” / “)
Names.shift();
document.getElementById(“JavaArray4″).innerHTML = Names.join(” / “)
Names.unshift(“Suba”);
document.getElementById(“JavaArray5″).innerHTML = Names.join(” / “)
</script>
</body>
</html>
/////////////////////////////////////////////////////////////////////////
Eight Program
<html>
<head>
<title>My Eighth JavaScript Application</title>
</head>
<body>
<h1>Kaashiv Eighth Application – JavaScript Arrays and Tranversing</h1>
<p id=”JavaArray1″></p>
<p id=”JavaArray2″></p>
<p id=”JavaArray3″></p>
<p id=”JavaArray4″></p>
<script>
var Names = [“venkat”, “krishiv”, “Arun”, “Banu”];
document.getElementById(“JavaArray1″).innerHTML = Names.join(” – “)
Names.sort();
document.getElementById(“JavaArray2″).innerHTML = Names.join(” / “)
Names.reverse();
document.getElementById(“JavaArray3″).innerHTML = Names.join(” / “)
var txt = “”;
var numbers = [45, 4, 9, 16, 25];
numbers.forEach(myFunction);
document.getElementById(“JavaArray4”).innerHTML = txt;
function myFunction(value) {
txt = txt + value + “<br>”;
}
</script>
</body>
</html>
//////////////////////////////////////////////////////////////////////////////////
Nineth Program
<html>
<head>
<title>My Nineth JavaScript Application</title>
</head>
<body>
<h1>Kaashiv Nineth Application – JavaScript If else condition</h1>
<button onclick=”myFunction()”>Fetch the time of a day</button>
<p id=”JavaArray1″></p>
<script>
function myFunction()
{
var Daytimeval;
var time = new Date().getHours();
if (time < 10)
{
Daytimeval = “Good morning”;
}
else if (time < 20)
{
Daytimeval = “Good day”;
}
else
{
Daytimeval = “Good evening”;
}
document.getElementById(“JavaArray1”).innerHTML = Daytimeval;
}
</script>
</body>
</html>
////////////////////////////////////////////////////////////////////
Tenth Program
<!DOCTYPE html>
<html>
<body>
<h1>Tenth Program – Switch Case Statement</h1>
<p id=”JavaScriptSwitch”></p>
<script>
var day;
switch (new Date().getDay()) //get the system date and fetch the day.
{
case 0:
day = “Sunday”;
break;
case 1:
day = “Monday”;
break;
case 2:
day = “Tuesday”;
break;
case 3:
day = “Wednesday”;
break;
case 4:
day = “Thursday”;
break;
case 5:
day = “Friday”;
break;
case 6:
day = “Saturday”;
}
document.getElementById(“JavaScriptSwitch”).innerHTML = “Today is ” + day;
</script>
</body>
</html>
////////////////////////////////////////////////////////////////////////////////
Eleventh Program
<html>
<head>
<title>My Eleventh JavaScript Application</title>
</head>
<body>
<h1>Kaashiv Eleventh Application – JavaScript for and foreach</h1>
<p id=”JavaArray1″></p>
<p id=”JavaArray2″></p>
<script>
///////////////////////////////
var txt = “”;
var numbers = [“45”, “4”,”542″];
for( i =0; i < numbers.length;i++)
{
txt = txt + numbers[i] + “<br>”;
}
document.getElementById(“JavaArray1”).innerHTML = txt;
///////////////////////////////
var txt = “”;
var numbers = [45, 4, 9, 16, 25];
numbers.forEach(myFunction);
document.getElementById(“JavaArray2”).innerHTML = txt;
function myFunction(value) {
txt = txt + value + “<br>”;
}
</script>
</body>
</html>
////////////////////////////////////////////////////////////////
Twelfth Program
<html>
<head>
<title>My Twelfth JavaScript Application</title>
</head>
<body>
<h1>Kaashiv Twelfth Application – JavaScript while and dowhile</h1>
<p id=”JavaArray1″></p>
<p id=”JavaArray2″></p>
<script>
text=””;
i=0;
while(i<10)
{
text = text + “<br> The value of i is :” + i;
i++;
}
document.getElementById(“JavaArray1″).innerHTML = text;
/////////////////////////////////////
text=””;
i=0;
do
{
text = text + “<br> The value of i is :” + i;
i++;
}
while(i<10);
document.getElementById(“JavaArray2”).innerHTML = text;
</script>
</body>
</html>
//////////////////////////////////////////////////////////////////////////////////////
Thirteenth Program
<html>
<head>
<title>My Thirteenth JavaScript Application</title>
</head>
<body>
<h1>Kaashiv Thirteenth Application – JavaScript Classes and Objects</h1>
<p id=”JavaArray1″></p>
<p id=”JavaArray2″></p>
<script>
class VenkatClass
{
constructor(name,age)
{
this.name = name;
this.age= age;
}
}
VenkatObject= new VenkatClass (“krishiv”,10);
document.getElementById(“JavaArray1”).innerHTML =
“The Object value is – Object Name is “+ VenkatObject.name + ” – Object age is ” + VenkatObject.age;
</script>
</body>
</html>
////////////////////////////////////////////////////////////////////////////////
Fourteenth program
<!DOCTYPE html>
<html>
<body>
<h1>Javascript Fourteenth Program – JS Validations</h1>
<input id=”textval” type=”number” min=”200″ max=”500″ required>
<button onclick=”myValidations()”>Click to Check</button>
<p id=”JSvalidations”></p>
<script>
function myValidations()
{
var inputvalue = document.getElementById(“textval”);
var inputvalue1 = document.getElementById(“textval”).value;
if( inputvalue1 ==””)
{
document.getElementById(“JSvalidations”).innerHTML =
inputvalue.validationMessage;
}
else
document.getElementById(“JSvalidations”).innerHTML =
“The value is “+ inputvalue1;
}
</script>
</body>
</html>
//////////////////////////////////////////////////////////////////////////////
Fifteenth Program
<!DOCTYPE html>
<html>
<head>
<title>JS – External JavaScript</title>
<script src=”15.js”></script>
</head>
<body onload=”countToTen();”>
<h1>Let’s Count to 10 with JavaScript!</h1>
<h1>JS – External JavaScript</h1>
<p id=”Thevalue”></p>
</body>
</html>
///////////////////////////////////////////
function countToTen()
{
var count = 0;
while (count < 10)
{
count++;
document.getElementById(“Thevalue”).innerHTML +=count + “<br>”;
}
}
///////////////////////////// All the very best from Venkat ///////////////////////////////////////////////
