TNW (Web Service & ICT Solutions)
25 Jun 2022, 11:43:29

Input Datetime Local (HTML Objects)

Category : JavaScript Tutorials

<!DOCTYPE html>
<html>
<head>
<title>Js Code Testing</title>
</head>
<body>
<button onclick = "jsFun()">Try It</button>
<script>
function jsFun(){
var x = document.createElement("INPUT");
x.setAttribute("type", "datetime-local");
document.body.appendChild(x);
}
</script>
</body>
</html>

 
TNW (Web Service & ICT Solutions)
25 Jun 2022, 11:42:26

Input Date (HTML Objects)

Category : JavaScript Tutorials

<!DOCTYPE html>
<html>
<head>
<title>Js Code Test</title>
</head>
<button onclick = "jsFun()">Try It</button>
<body>
<script>
function jsFun(){
var x = document.createElement("INPUT");
x.setAttribute("type", "date");
document.body.appendChild(x);
}
</script>
</body>
</html>

 
TNW (Web Service & ICT Solutions)
25 Jun 2022, 11:41:01

JS Event Listener 2

Category : JavaScript Tutorials

<!DOCTYPE html>
<html>
<head>
<title>JavaScript Code Testing</title>
</head>
<body>

<button type = "button" id = "event">Try It</button>
<p id = "demo"></p>
<script>
var x = document.getElementById("event");
x.addEventListener("mouseover", jsFun1);
x.addEventListener("mousedown", jsFun2);
x.addEventListener("mouseout", jsFun3);

function jsFun1(){
document.getElementById("demo").innerHTML += "Mouse Over<br />";
}

function jsFun2(){
document.getElementById("demo").innerHTML += "Mouse Down<br />";
}

function…

 
TNW (Web Service & ICT Solutions)
25 Jun 2022, 11:40:30

JS Event Listener 1

Category : JavaScript Tutorials

<!DOCTYPE html>
<html>
<head>
<title>JavaScript Code Testing</title>
</head>
<body>
<p id = "demo">The Date is:</p>
<button type = "button" id = "test">Show Date</button>&nbsp;&nbsp;
<button type = "button" id = "test1">Hide</button>
<script>
document.getElementById("test").addEventListener('click', jsFun);
document.getElementById("test1").addEventListener('click', jsHide);

function jsFun(){
document.getElementById("demo").innerHTML = Date();
}

function jsHide(){
document.getElementById("demo").innerHTML = "";
}

</script>
</body>
</html>

 
TNW (Web Service & ICT Solutions)
25 Jun 2022, 11:39:36

timer (HTML DOM Window)

Category : JavaScript Tutorials

<!DOCTYPE html>
<html>
<head>
<title>Js Code Testing</title>
</head>
<body>
<button onclick = "startCount()">Start Count</button>
<input type = "text" id = "txt">
<button onclick = "stopCount()">Stop Count</button>
</body>
<script>
var c = 0;
var t;
var myTimer = 0;

function jsFun(){
document.getElementById("txt").value = c;
c++;
t = setTimeout(jsFun,…

 
TNW (Web Service & ICT Solutions)
25 Jun 2022, 11:39:05

progressBar (HTML DOM Window)

Category : JavaScript Tutorials

<!DOCTYPE html>
<html>
<head>
<title>Js Code Testing</title>
<style>
#progressBar{
width: 100%;
height: 30px;
position: relative;
background-color: grey;
}

#myBar{
width: 20px;
height: 30px;
position: absolute;
background-color: green;
}
</style>
</head>
<body>
<div id = "progressBar">
<div id = "myBar"></div>
</div><p></p>
<button onclick = "myMove()">Try Now</button>
<script>
function myMove(){
var ele = document.getElementById("myBar");
var width =…

 
TNW (Web Service & ICT Solutions)
25 Jun 2022, 11:38:30

moveTo (HTML DOM Window)

Category : JavaScript Tutorials

<!DOCTYPE html>
<html>
<head>
<title>Js Code Testing</title>
</head>
<body>
<button onclick = "openWin()">Open Window</button>
<button onclick = "moveWin()">Move Window</button>
<script>
function openWin(){
myWindow = window.open('', 'myWindow', 'width=300px, height=200px');
myWindow.document.write('hello');
myWindow.document.designMode = "On";
}

function moveWin(){
myWindow.moveTo(500, 300);
myWindow.focus();
}
</script>
</body>
</html>

 
TNW (Web Service & ICT Solutions)
25 Jun 2022, 11:37:55

close (HTML DOM Window)

Category : JavaScript Tutorials

<!DOCTYPE html>
<html>
<head>
<title>Js Code Testing</title>
</head>
<body>
<div id = "msg"></div>
<button onclick = "openWin()">Open Window</button>
<button onclick = "closeWin()">Close Window</button>
<button onclick = "chkStatus()">Check Status</button>

<script>

var myWin;

function openWin(){
myWin = window.open("", "myWin", "width=300px, height=200px");
}

function closeWin(){
if(myWin){
myWin.close();
}
}

function chkStatus(){
if(!myWin){
document.getElementById("msg").innerHTML = "Window…

 
TNW (Web Service & ICT Solutions)
25 Jun 2022, 11:35:58

onchange 1 (HTML DOM Events)

Category : JavaScript Tutorials

<!DOCTYPE html>
<html>
<head>
<title>JS Code Testing</title>
</head>
<body>
<input type = "text" id = "fname" onchange = "jsFun()">
<script>
function jsFun(){
var x = document.getElementById("fname");
x.value = x.value.toUpperCase();
}
</script>
</body>
</html>

 
TNW (Web Service & ICT Solutions)
25 Jun 2022, 11:35:20

onchange (HTML DOM Events)

Category : JavaScript Tutorials

<!DOCTYPE html>
<html>
<head>
<title>JS Code Testing</title>
</head>
<body>
<select id = "myId" onchange = "jsFun()">
<option value = "#">Choose Options</option>
<option value = "Thet">Thet</option>
<option value = "Naing">Naing</option>
<option value = "Win">Win</option>
</select>
<p id = "demo"></p>
<script>
function…

 
TNW (Web Service & ICT Solutions)
24 Jun 2022, 12:09:13

appendChild() (HTML DOM Elements)

Category : JavaScript Tutorials

<!DOCTYPE html>
<html>
<head>
<title>JS Code Testing</title>
</head>
<body>
<button onclick = "jsFun()"> + </button>
<script>
function jsFun(){
var para = document.createElement("P");
var txtNode = document.createTextNode("Paragraph");
para.appendChild(txtNode);
document.body.appendChild(para);
}
</script>
</body>
</html>

 
TNW (Web Service & ICT Solutions)
24 Jun 2022, 12:08:45

appendChild() (HTML DOM Elements)

Category : JavaScript Tutorials

<!DOCTYPE html>
<html>
<head>
<title>JS Code Testing</title>
<style>
#myDiv{
width: 200px;
border: 2px solid red;
padding: 5px;
text-align: center;
}
</style>
</head>
<body>
<button onclick = "jsFun()"> + </button>
<p></p>
<div id = "myDiv">My Example</div>
<script>
function jsFun(){
var para = document.createElement("P");
var txtNode = document.createTextNode("Example");
para.appendChild(txtNode);
document.getElementById("myDiv").appendChild(para);
}
</script>
</body>
</html>

 
TNW (Web Service & ICT Solutions)
24 Jun 2022, 12:08:17

appendChild() (HTML DOM Elements)

Category : JavaScript Tutorials

<!DOCTYPE html>
<html>
<head>
<title>JS Code Testing</title>
</head>
<body>
<ul id = "myText">
<li>Thet</li>
<li>Naing</li>
</ul>

<button onclick = "jsFun()">Try It</button>

<script>
function jsFun(){
var node = document.createElement("LI");
var txtNode = document.createTextNode("Win");
node.appendChild(txtNode);
document.getElementById("myText").appendChild(node);
}
</script>
</body>
</html>

 
TNW (Web Service & ICT Solutions)
24 Jun 2022, 12:07:06

addEventListener() (HTML DOM Elements)

Category : JavaScript Tutorials

<!DOCTYPE html>
<html>
<head>
<title>JS Code Testing</title>
</head>
<body>
<button id = "myId">Try It</button>
<p id = "demo"></p>
<script>
var x = document.getElementById("myId");
x.addEventListener("mouseover", msOver);
x.addEventListener("click", msClick);
x.addEventListener("mouseout", msOut);

function msOver(){
document.getElementById("demo").innerHTML += "Mouse Over <br />";
}

function msClick(){
document.getElementById("demo").innerHTML += "Mouse Click <br />";
}

function msOut(){
document.getElementById("demo").innerHTML…

 
TNW (Web Service & ICT Solutions)
24 Jun 2022, 12:06:32

addEventListener() (HTML DOM Elements)

Category : JavaScript Tutorials

<!DOCTYPE html>
<html>
<head>
<title>JS Code Testing</title>
</head>
<body>
<button id = "myId">Try It</button>
<p id = "demo"></p>
<script>
var p1 = 9;
var p2 = 9;
document.getElementById("myId").addEventListener("click", function(){myFun(p1, p2)});

function myFun(num1, num2){
var x = num1 * num2;
document.getElementById("demo").innerHTML = x;
}
</script>
</body>
</html>

 
TNW (Web Service & ICT Solutions)
24 Jun 2022, 12:05:41

addEventListener() (HTML DOM Elements)

Category : JavaScript Tutorials

<!DOCTYPE html>
<html>
<head>
<title>JS Code Testing</title>
</head>
<body>
<button id = "myId">Try It</button>

<script>
var x = document.getElementById("myId");
x.addEventListener("click", myFun1);
x.addEventListener("click", myFun2);

function myFun1(){
alert("Function1");
}

function myFun2(){
alert("Function2");
}
</script>
</body>
</html>

 
TNW (Web Service & ICT Solutions)
24 Jun 2022, 11:54:00

querySelectorAll() (HTML DOM Document)

Category : JavaScript Tutorials

<!DOCTYPE html>
<html>
<head>
<title>JS Code Testing</title>
</head>
<body>
<h1 class = "example">Heading</h1>
<p class = "example">Paragraph</p>
<button onclick = "jsFun()">Try It</button>
<script>
function jsFun(){
var i;
var x = document.querySelectorAll(".example");
for(i = 0; i < x.length; i++){
x[i].style.color = "red";
}
}
</script>
</body>
</html>

 
TNW (Web Service & ICT Solutions)
24 Jun 2022, 11:52:53

getElementsByTagName (HTML DOM Document)

Category : JavaScript Tutorials

<!DOCTYPE html>
<html>
<head>
<title>JS Code Testing</title>
<style>
</style>
</head>
<body>
<ol>
<li>Example_1</li>
<li>Example_2</li>
<li>Example_3</li>
</ol>
<button onclick = "jsFun()">Red</button>
<script>
function jsFun(){
var i;
var x = document.getElementsByTagName("LI");
for(i = 0; i < x.length; i++){
x[i].style.color = "red";
}
}
</script>
</body>
</html>

 
TNW (Web Service & ICT Solutions)
24 Jun 2022, 11:51:48

getElementsByClassName (HTML DOM Document)

Category : JavaScript Tutorials

<!DOCTYPE html>
<html>
<head>
<title>JS Code Testing</title>
<style>
.Example{
border: 2px solid yellow;
padding: 5px;
width: 100px;
}
</style>
</head>
<body>
<div class = "Example">
Example_1
</div>
<div class = "Example">
Example_2
</div>
<div class = "Example">
Example_3
</div><br />

<button style = "background: red" onclick = "colRed()">Red</button>
<button style = "background: green"…

 
TNW (Web Service & ICT Solutions)
24 Jun 2022, 11:50:34

document.links (HTML DOM Document)

Category : JavaScript Tutorials

<!DOCTYPE html>
<html>
<head>
<title>JS Code Testing</title>
</head>
<body>
<button onclick = "jsGreen()">Green</button>
<button onclick = "jsRed()">Red</button><br />

<p id = "demo"></p>

<li><a href = "tnwict.com">tnwict.com</a></li>
<li><a href = "tnw87.com">tnw87.com</a></li>
<li><a href = "tnw87.site">tnw87.site</a></li>

<script>
function jsGreen(){
var i;
var x = document.links;
for(i = 0;…

 
TNW (Web Service & ICT Solutions)
24 Jun 2022, 11:48:24

Creating Text Node (HTML DOM Document)

Category : JavaScript Tutorials

<!DOCTYPE html>
<html>
<head>
<title>JS Code Testing</title>
<style>
#myDiv{
border: 1px solid red;
margin-bottom: 10px;
}
</style>
</head>
<body>
<div id = "myDiv">
This is just Testing.
</div>
<button onclick = "jsFun()">+</button>
<script>
function jsFun(){
var para = document.createElement("P");
para.innerHTML = "Paragraph";
document.getElementById("myDiv").appendChild(para);
}
</script>
</body>
</html>

 
TNW (Web Service & ICT Solutions)
24 Jun 2022, 11:41:03

Creating a Calculator with JS

Category : JavaScript Tutorials

<html>
<head>
<title>Math Fun</title>
<script>
function registerEvents(){
document.mathWiz.operate.addEventListener('click', doTheMath, false);
}
function doTheMath(){
var first = parseInt(document.mathWiz.numberOne.value);
var second = parseInt(document.mathWiz.numberTwo.value);
var operator = document.mathWiz.operator.value;

switch (operator){
case "add":
var answer = first + second;
break;
case "substract":
var answer = first - second;
break;
case "multiply":
var answer…

 
TNW (Web Service & ICT Solutions)
22 Jun 2022, 18:12:27

JS Timer

Category : JavaScript Tutorials

<!DOCTYPE html>
<html>
<head>
<title>JS Code Testing</title>
</head>
<body>
<button onclick = "myTimer = setInterval(jsCount, 1000)">Start Count</button>
<button onclick = "clearInterval(myTimer)">Stop Count</button>
<p id = "demo"></p>
<script>
c = 0;
function jsCount(){
document.getElementById("demo").innerHTML = ++c;
}
</script>
</body>
</html>

 
TNW (Web Service & ICT Solutions)
22 Jun 2022, 18:10:53

Creating Readmore Button

Category : JavaScript Tutorials

<!DOCTYPE html>
<html>
<head>
<titile>Code Testing For Read More Function</titile>
<style>
#more{
display: none;
}
</style>
</head>
<body>
<p>
I am Thet Naing Win. I am 35 years old man. Now I stay in…

 
TNW (Web Service & ICT Solutions)
22 Jun 2022, 18:09:37

Creating Nav Bar

Category : JavaScript Tutorials

<!DOCTYPE html>
<html>
<head>
<title>JS Code Testing</title>
<style>
body{
margin: 0px;
font-size: 14px;
}

.header{
background-color: grey;
text-align: center;
padding: 12px;
}

#navbar{
overflow: hidden;
background-color: black;
}

#navbar a{
display: block;
float: left;
padding: 16px 32px;
text-decoration: none;
color: white;
}

#navbar a:hover{
background-color: gray;
}

#navbar a:focus{
background-color: green;
}

.content{
padding: 16px;
line-height: 25px;
}

.sticky{
position: fixed;
top: 0px;
width: 100%;
}

.sticky + .content{
padding-top: 60px;
}


</style>
</head>
<body…

 
TNW (Web Service & ICT Solutions)
22 Jun 2022, 18:08:34

Dropdown Menu

Category : JavaScript Tutorials

<!DOCTYPE html>
<html>
<head>
<title>JS Code Testing</title>
<style>
.dropdown{
display: inline-block;
position: relative;
}

.dropbtn{
background-color: red;
font-size: 14px;
color: white;
padding: 12px 32px;
cursor: pointer;
border: 2px solid green;
}

.dropbtn:hover, .dropbtn:focus{
background-color: orange;
}

.dropcontent{
display: none;
overflow: auto;
position: absolute;
box-shadow: 0px 2px 1px 3px;
}

.dropcontent a{
display: block;
color: white;
padding: 15px 32px;
text-decoration: none;
background-color:…

 
TNW (Web Service & ICT Solutions)
22 Jun 2022, 18:08:00

Display a Clock

Category : JavaScript Tutorials

<!DOCTYPE html>
<html>
<head>
<title>JS Code Testing</title>
<script>
function startTime(){
var today = new Date();
var h = today.getHours();
var m = today.getMinutes();
var s = today.getSeconds();
m = checkTime(m);
s = checkTime(s);
document.getElementById("demo").innerHTML = h + ":" + m + ":"…

 
TNW (Web Service & ICT Solutions)
22 Jun 2022, 18:06:29

Converting Celsius to Fahrenheit

Category : JavaScript Tutorials

<!DOCTYPE html>
<html>
<head>
<title>JS Code Testing</title>
</head>
<body>
<p><input id = "c" onkeyup = "temperature('C')"> degree Celsius.</p>
<p><input id = "f" onkeyup = "temperature('F')"> degree Fahrenheit.</p>
<script>
function temperature(degree){
var x;
if(degree == "C"){
x = document.getElementById("c").value * 9 / 5…

 
TNW (Web Service & ICT Solutions)
22 Jun 2022, 18:04:53

Change Background Color of Html Elements

Category : JavaScript Tutorials

<!DOCTYPE html>
<html>
<head>
<title>JS Code Testing</title>
</head>
<body>
<table style = "width:300px; height:100px">
<tr>
<td onmouseover = "bgChange(this.style.backgroundColor)";
onmouseout = "bgChange('transparent')";
style = "background-color:red"></td>
<td onmouseover = "bgChange(this.style.backgroundColor)";
onmouseout = "bgChange('transparent')";
style = "background-color:green"></td>
<td…

 
TNW (Web Service & ICT Solutions)
22 Jun 2022, 18:03:21

JS Animation

Category : JavaScript Tutorials

<!DOCTYPE html>
<html>
<head>
<title>JS Code Testing</title>
<style>
#mySlide{
position: relative;
}

li{
position: relative;
list-style: none;
display: block;
float: left;
padding: 0px 10%;
width: auto;
}

@keyframes mymove{
from { left: 0px; }
to { left: 100%; }
}

@-webkit-keyframes{
from { left: 0px; }
to { left: 100%; }
}
</style>
</head>
<body onload…

 
TNW (Web Service & ICT Solutions)
22 Jun 2022, 18:01:59

Switch (JS Statement)

Category : JavaScript Tutorials

<!DOCTYPE html>
<html>
<head>
<title>JavaScript Statement</title>
</head>
<body>
<p id = "demo">What is Today?</p>
<button type = "button" onclick = "jsFunction()">Click Now</button>
<script>
function jsFunction(){
switch(new Date().getDay()){
case 0:
day = "Sunday";
break;

case 1:
day = "Monday";
break;

case 2:
day = "Tuesday";
break;

case 3:
day = "Wednesday";
break;

case 4:
day…

 
TNW (Web Service & ICT Solutions)
22 Jun 2022, 18:01:25

If (JS Statement)

Category : JavaScript Tutorials

<!DOCTYPE html>
<html>
<head>
<title>JavaScript Statement</title>
</head>
<body>
<h1>JavaScript Code Testing</h1>
<p id = "demo1"></p>
<p id = "demo2"></p>
<p id = "demo3"></p>
<button type = "button" onclick = "jsFunction()">Try Now</button>
<script>
function jsFunction(){
var you = "I like to swim.";
var me =…

 
TNW (Web Service & ICT Solutions)
22 Jun 2022, 18:00:50

Continue (JS Statement)

Category : JavaScript Tutorials

<!DOCTYPE html>
<html>
<head>
<title>JavaScript Code Testing</title>
</head>
<body>
<p id = "demo"></p>
<script>
var txt = "", i;
for(i = 0; i < 10; i++){
if (i===5){continue;}
txt += i + "<br />";
}
document.getElementById("demo").innerHTML = txt;
</script>
</body>
</html>

 
TNW (Web Service & ICT Solutions)
22 Jun 2022, 18:00:18

Break (JS Statement)

Category : JavaScript Tutorials

<!DOCTYPE html>
<html>
<head>
<title>JavaScript Code Testing</title>
</head>
<body>
<p id = "demo"></p>
<script>
var txt = "", i;
for(i = 0; i < 10; i++){
if (i===5){break;}
txt += i + "<br />";
}
document.getElementById("demo").innerHTML = txt;
</script>
</body>
</html>

 
TNW (Web Service & ICT Solutions)
22 Jun 2022, 17:58:27

Random Integer (JS Random)

Category : JavaScript Tutorials

<!DOCTYPE html>
<html>
<head>
<title>JavaScript Code Testing</title>
</head>
<body>
<p id = "demo">Please click Random for random numbers.</p>
<button type = "button" onclick = "jsRand()">Random</button>
<script>
function jsRand(){
var rand = Math.floor(Math.random() * 4000);
document.getElementById("demo").innerHTML = rand;
}
</script>
</body>
</html>

 
TNW (Web Service & ICT Solutions)
22 Jun 2022, 17:57:41

Proper Random Function (JS Random)

Category : JavaScript Tutorials

<!DOCTYPE html>
<html>
<head>
<title>JavaScript Code Testing</title>
</head>
<body>
<p id = "demo">Click Random for random numbers.</p>
<button type = "button" onclick = "myRand()">Random</button>
<script>

function myRand(){
var rand = jsRand(100000, 900000);
document.getElementById("demo").innerHTML = rand;
}

function jsRand(min, max){
return Math.floor(Math.random() * (max -…

 
TNW (Web Service & ICT Solutions)
22 Jun 2022, 09:48:13

Math.sqrt() (JS Math)

Category : JavaScript Tutorials

<!DOCTYPE html>
<html>
<head>
<title>JavaScript Code Testing</title>
</head>
<body>
<p id = "demo">This is JavaScript Math.sqrt Testing</p>
<button type = "button" onclick = "jsSqrt()">Math Sqrt</button>

<script>
var a = 81;
document.getElementById("demo").innerHTML = a;

function jsSqrt(){
var b = Math.sqrt(a);
document.getElementById("demo").innerHTML = b;
}
</script>
</body>
</html>

 
TNW (Web Service & ICT Solutions)
22 Jun 2022, 09:47:21

Math.round() (JS Math)

Category : JavaScript Tutorials

<!DOCTYPE html>
<html>
<head>
<title>JavaScript Code Testing</title>
</head>
<body>
<p id = "demo">This is JavaScript Math.round Testing</p>
<button type = "button" onclick = "jsRound()">Math Round</button>

<script>
var a = 4.576;
var b = 4.345;
document.getElementById("demo").innerHTML = a + " and "…

 
TNW (Web Service & ICT Solutions)
22 Jun 2022, 09:46:32

Math.random() (JS Math)

Category : JavaScript Tutorials

<!DOCTYPE html>
<html>
<head>
<title>JavaScript Code Testing</title>
</head>
<body>
<p id = "demo">This is JavaScript Math.random Testing</p>
<button type = "button" onclick = "jsRandom()">Math Random</button>
<script>
function jsRandom(){
var a = Math.random();
document.getElementById("demo").innerHTML = a;
}
</script>
</body>
</html>

 
TNW (Web Service & ICT Solutions)
22 Jun 2022, 09:45:52

Math.pow() (JS Math)

Category : JavaScript Tutorials

<!DOCTYPE html>
<html>
<head>
<title>JavaScript Code Testing</title>
</head>
<body>
<p id = "demo">This is JavaScript Math.pow Testing</p>
<button type = "button" onclick = "jsPower()">Math Power</button>

<script>
var a = 9;
var b = 5;
document.getElementById("demo").innerHTML = a + " and "…

 
TNW (Web Service & ICT Solutions)
22 Jun 2022, 09:44:51

Math.PI (JS Math)

Category : JavaScript Tutorials

<!DOCTYPE html>
<html>
<head>
<title>JavaScript Code Testing</title>
</head>
<body>
<p id = "demo1">This is JavaScript Math.PI Testing</p>
<button type = "button" onclick = "jsPI()">Math PI</button>
<script>
function jsPI(){
var pi = Math.PI;
document.getElementById("demo1").innerHTML = pi;
}
</script>
</body>
</html>

 
TNW (Web Service & ICT Solutions)
22 Jun 2022, 09:40:14

JS While Loop

Category : JavaScript Tutorials

<!DOCTYPE html>
<html>
<head>
<title>JavaScript Code Testing</title>
</head>
<body>
<p id = "demo"></p>
<script>
var names = ["Maung Maung", "Aung Aung", "Mya Mya", "Hla Hla"];
var txt, i = 0;
txt = "<ol>";
while(i < names.length){
txt += "<li>" + names[i] +…

 
TNW (Web Service & ICT Solutions)
22 Jun 2022, 09:39:35

forof (JS For Loop)

Category : JavaScript Tutorials

<!DOCTYPE html>
<html>
<head>
<title>JavaScript Code Testing</title>
</head>
<body>
<p id = "demo"></p>
<script>
var names = ["Maung Maung", "Aung Aung", "Mya Mya", "Hla Hla"];
var txt;

for(txt of names){
document.write("<li>" + txt + "</li>");
}
</script>
</body>
</html>

 
TNW (Web Service & ICT Solutions)
22 Jun 2022, 09:39:01

for (JS For Loop)

Category : JavaScript Tutorials

<!DOCTYPE html>
<html>
<head>
<title>JavaScript Code Testing</title>
</head>
<body>
<p id = "demo"></p>
<script>
var names = ["Maung Maung", "Aung Aung", "Mya Mya", "Hla Hla"];
var i, txt;

txt = "<ol>";
for(i=0; i<names.length; i++){
txt += "<li>" + names[i] + "</li>";
}
txt +=…

 
TNW (Web Service & ICT Solutions)
22 Jun 2022, 09:37:54

forin (JS For Loop)

Category : JavaScript Tutorials

<!DOCTYPE html>
<html>
<head>
<title>JavaScript Code Testing</title>
</head>
<body>
<p id = "demo"></p>
<script>
var names = ["Maung Maung", "Aung Aung", "Mya Mya", "Hla Hla"];
var i, txt;

txt = "<ol>";
for(i in names){
txt += "<li>" + names[i] + "</li>";
}
txt +=…

 
TNW (Web Service & ICT Solutions)
22 Jun 2022, 09:36:53

JS Form Validation

Category : JavaScript Tutorials

<!DOCTYPE html>
<html>
<head>
<title>JavaScript Code Testing</title>
</head>
<body>
<script>
function formValidate(){
var x = document.forms["myForm"]["fname"].value;
if(x == ""){
alert("Must fill out in the form");
return false;
}
}
</script>
</body>
<form action = "formvalidate1.html" method = "POST" onsubmit = "return formValidate()" name = "myForm">
<input type…

 
TNW (Web Service & ICT Solutions)
22 Jun 2022, 09:35:47

Throw Statement (JS Errors)

Category : JavaScript Tutorials

<!DOCTYPE html>
<html>
<head>
<title>JavaScript Code Testing</title>
</head>
<body>
<input id = "demo" type = "text">
<button type = "button" onclick = "jsFun()">Check Input</button>
<p id = "page"></p>
<script>
function jsFun(){
var sms, x;
sms = document.getElementById("page");
sms.innerHTML = "";
x = document.getElementById("demo").value;
try{
if(x ==…

 
TNW (Web Service & ICT Solutions)
22 Jun 2022, 09:35:11

Finally Statement (JS Errors)

Category : JavaScript Tutorials

<!DOCTYPE html>
<html>
<head>
<title>JavaScript Cdoe Testing</title>
</head>
<body>
<input id = "demo" type = "text">
<button type = "button" onclick = "jsFun()">Check Input</button>
<p id = "page"></p>
<script>
function jsFun(){
var sms, x;
sms = document.getElementById("page");
sms.innerHTML;
x = document.getElementById("demo").value;
try {
if (x ==…

 
TNW (Web Service & ICT Solutions)
22 Jun 2022, 09:33:58

JS Arrow Function

Category : JavaScript Tutorials

<!DOCTYPE html>
<html>
<head>
<title>JavaScript Code Testing</title>
</head>
<body>
<button id = "btn1">Try Now</button>
<p id = "demo1"></p>

<button id = "btn2">Try Now</button>
<p id = "demo2"></p>

<script>
var test1 = function(){
document.getElementById("demo1").innerHTML += this;
}

//window object calls the function
window.addEventListener("load", test1);

//button object calls…

 
TNW (Web Service & ICT Solutions)
22 Jun 2022, 08:04:31

Inheritance (JS Classes)

Category : JavaScript Tutorials

<!DOCTYPE html>
<html>
<head>
<title>JavaScript Code Testing</title>
</head>
<body>
<p id = "demo">Inheritance Test</p>
<script>
class Car{
constructor(brand){
this.carname = brand;
}
present(){
return "I have " + this.carname;
}
}

class Model extends Car{
constructor(brand, mod){
super(brand);
this.model = mod;
}
show(){
return this.present() + " and the model is "…

 
TNW (Web Service & ICT Solutions)
22 Jun 2022, 08:03:15

Getter and Setter (JS Classes)

Category : JavaScript Tutorials

<!DOCTYPE html>
<html>
<head>
<title>JavaScript Code Testing</title>
</head>
<body>
<p id = "demo"></p>
<script>
class Car{
constructor(brand){
this.carname = brand;
}
get cnam(){
return this.carname;
}
set cnam(x){
this.carname = x;
}
}
const myCar = new Car["Tesla"];
document.getElementById("demo").innerHTML = myCar;
</script>
</body>
</html>

 
TNW (Web Service & ICT Solutions)
22 Jun 2022, 08:02:28

Creating Object (JS Classes)

Category : JavaScript Tutorials

<!DOCTYPE html>
<html>
<head>
<title>JavaScript Code Testing</title>
</head>
<body>
<p id ="demo"></p>
<script>
class Name{
constructor(Name, City){
this.name = Name;
this.city = City;
}
}

var newName = new Name("Thet", "Yangon");
document.getElementById("demo").innerHTML = newName.name + " stays in " + newName.city + ".";

</script>
</body>
</html>

 
TNW (Web Service & ICT Solutions)
22 Jun 2022, 08:01:10

Class Methods (JS Classes)

Category : JavaScript Tutorials

<!DOCTYPE html>
<html>
<head>
<title>JavaScript Code Testing</title>
</head>
<body>
<p id = "demo">What is your name and age?</p>
<button type = "button" onclick = "jsFun()">Check Name and Age</button>
<script>
function jsFun(){
class Name{
constructor(Name, Year){
this.name = Name;
this.year = Year;
}

age(){
const date =…

 
TNW (Web Service & ICT Solutions)
21 Jun 2022, 10:22:01

Reduce() (JS Array Iteration)

Category : JavaScript Tutorials

<!DOCTYPE html>
<html>
<head>
<title>JavaScript Code Testing</title>
</head>
<body>
<p id = "demo"></p>

<button type = "button" onclick = "jsReduce()">Total</button>&nbsp;&nbsp;
<button type = "button" onclick = "jsReset()">Reset</button>

<script>
var numbers = [302, 428, 49, 92, 84, 70, 80, 10, 3,…

 
TNW (Web Service & ICT Solutions)
21 Jun 2022, 10:21:20

Map() (JS Array Iteration)

Category : JavaScript Tutorials

<!DOCTYPE html>
<html>
<head>
<title>JavaScript Code Testing</title>
</head>
<body>
<p id = "demo"></p>
<button type = "button" onclick = "jsDouble()">Double</button>&nbsp;&nbsp;
<button type = "button" onclick = "jsReset()">Reset</button>&nbsp;&nbsp;
<button type = "button" onclick = "jsTriple()">Triple</button>
<script>
var numbers = [302, 428, 49,…

 
TNW (Web Service & ICT Solutions)
21 Jun 2022, 10:20:42

Foreach() (JS Array Iteration)

Category : JavaScript Tutorials

<!DOCTYPE html>
<html>
<head>
<title>JavaScript Code Testing</title>
</head>
<body>
<p id = "demo"></p>
<script>
var txt = "";
var numbers = [302, 428, 49, 92, 84, 70, 80, 10, 3, 200];
var num = numbers.sort(function (a, b){return a - b;});

txt…

 
TNW (Web Service & ICT Solutions)
21 Jun 2022, 10:19:38

Find() (JS Array Iteration)

Category : JavaScript Tutorials

<!DOCTYPE html>
<html>
<head>
<title>JavaScript Code Testing</title>
</head>
<body>
<p id = "demo">Find the first number greater than 20</p>

<button type = "button" onclick = "jsFind()">Find > 20</button>&nbsp;&nbsp;
<button type = "button" onclick = "jsReset()">Reset</button>

<script>
var numbers = [302,…

 
TNW (Web Service & ICT Solutions)
21 Jun 2022, 10:18:54

Filter() (JS Array Iteration)

Category : JavaScript Tutorials

<!DOCTYPE html>
<html>
<head>
<title>JavaScript Code Testing</title>
</head>
<body>
<p id = "demo"></p>
<button type = "button" onclick = "jsFilter()">Less Than 100</button>&nbsp;&nbsp;
<button type = "button" onclick = "jsReset()">Reset</button>

<script>
var numbers = [302, 428, 49, 92, 84, 70, 80,…

 
TNW (Web Service & ICT Solutions)
14 Jun 2022, 21:02:50

Sort() and reverse() numerically (JS Array Sort)

Category : JavaScript Tutorials

<!DOCTYPE html>
<html>
<head>
<title>JavaScript Code Testing</title>
</head>
<body>
<p id = "demo">Sort Numberically</p>
<button type = "button" onclick = "jsSort()">Sort</button>
<button type = "button" onclick = "jsReverse()">Reverse</button>
<script>
var numbers = [400, 40, 20, 200, 93, 49];
document.getElementById("demo").innerHTML = numbers.join("<br…

 
TNW (Web Service & ICT Solutions)
14 Jun 2022, 21:01:00

Sort() and reverse() alphabetically (JS Array Sort)

Category : JavaScript Tutorials

<!DOCTYPE html>
<html>
<head>
<title>JavaScript Code Testing</title>
</head>
<body>
<p id = "demo"></p>
<button type = "button" onclick = "jsSort()">Sort</button>&nbsp;&nbsp;
<button type = "button" onclick = "jsReverse()">Reverse</button>
<script>
var cities = ["Yangon", "Mandalay", "Naypyidaw", "Meikhtila", "Bagan"];
document.getElementById("demo").innerHTML = cities.join(" * ");

function…

 
TNW (Web Service & ICT Solutions)
14 Jun 2022, 20:59:37

Sort number randomly (JS Array Sort)

Category : JavaScript Tutorials

<!DOCTYPE html>
<html>
<head>
<title>JavaScript Code Testing</title>
</head>
<body>
<p id = "demo"></p>
<button type = "button" onclick = "jsRandom()">Sort Now</button>
<script>
var numbers = [300, 40, 83, 49, 92, 200, 79];
document.getElementById("demo").innerHTML = numbers.join("<br />");

function jsRandom(){
var random = numbers.sort(function(a,…

 
TNW (Web Service & ICT Solutions)
14 Jun 2022, 20:58:36

Math.max and Math.min (JS Array Sort)

Category : JavaScript Tutorials

<!DOCTYPE html>
<html>
<head>
<title>JavaScript Code Testing</title>
</head>
<body>
<p id = "demo"></p>
<button type = "button" onclick = "findMax()">Find Max</button>
<button type = "button" onclick = "jsReset()">Reset</button>
<button type = "button" onclick = "findMin()">Find Min</button>

<script>
var numbers = [200,…

 
TNW (Web Service & ICT Solutions)
14 Jun 2022, 20:57:29

Find maximum or minimum number (JS Array Sort)

Category : JavaScript Tutorials

<!DOCTYPE html>
<html>
<head>
<title>JavaScript Code Testing</title>
</head>
<body>
<p id = "demo"></p>
<button type = "button" onclick = "findMax()">Find Max</button>&nbsp;&nbsp;
<button type = "button" onclick = "numReset()">Reset</button>&nbsp;&nbsp;
<button type = "button" onclick = "findMin()">Find Min</button>

<script>
var numbers = [200,…

 
TNW (Web Service & ICT Solutions)
13 Jun 2022, 19:54:27

Array Function

Category : JavaScript Tutorials

<!DOCTYPE html>
<html>
<head>
<title>JavaScript Code Testing</title>
</head>
<body>
<button id = "btn1">Try Now</button>
<p id = "demo1"></p>

<button id = "btn2">Try Now</button>
<p id = "demo2"></p>

<script>
var test1 = function(){
document.getElementById("demo1").innerHTML += this;
}

//window object calls the function
window.addEventListener("load", test1);

//button object calls…

 
TNW (Web Service & ICT Solutions)
13 Jun 2022, 19:52:37

Objects (JS Arrays)

Category : JavaScript Tutorials

<!DOCTYPE html>
<html>
<head>
<title>JavaScript Code Testing</title>
</head>
<body>
<p id = "demo"></p>
<script>
var myName = {firstName : "Thet", middleName : "Naing", lastName : "Win"};
document.getElementById("demo").innerHTML = myName.firstName;
</script>
</body>
</html>

 
TNW (Web Service & ICT Solutions)
13 Jun 2022, 19:52:03

Looping Array Element (JS Arrays)

Category : JavaScript Tutorials

<!DOCTYPE html>
<html>
<head>
<title>JavaScript Code Testing</title>
</head>
<body>
<p id = "demo"></p>
<script>
var cities, clen, text, i;
cities = ["Yangon", "Mandalay", "Naypyidaw", "Meikhtila"];
clen = cities.length;
text = "<ul>";
for(i=0; i<clen; i++){
text += "<li>" + cities[i] + "</li>";
}
text += "</ul>";
document.getElementById("demo").innerHTML…

 
TNW (Web Service & ICT Solutions)
13 Jun 2022, 19:51:24

Foreach Loop (JS Arrays)

Category : JavaScript Tutorials

<!DOCTYPE html>
<html>
<head>
<title>JavaScript Code Testing</title>
</head>
<body>
<p id = "demo">forEach Loop</p>
<script>
var cities, text;
cities = ["Yangon", "Mandalay", "Naypyidaw", "Meikhtila"];

text = "<ul>";
cities.forEach(jsFunction);
text+= "</ul>";

function jsFunction(value){
text += "<li>" + value + "</li>";
}

document.getElementById("demo").innerHTML = text;

</script>
</body>
</html>

 
TNW (Web Service & ICT Solutions)
13 Jun 2022, 19:50:56

Creating the Array (JS Arrays)

Category : JavaScript Tutorials

<!DOCTYPE html>
<html>
<head>
<title>JavaScript Code Testing</title>
</head>
<body>
<p id = "demo1"></p>
<p id = "demo2"></p>
<script>

//good habit in crating array
var a = ["aaa", "bbb", "ccc", "ddd"];
document.getElementById("demo1").innerHTML = a;

//bad habit in creating array
var b = new Array("aaa",…

 
TNW (Web Service & ICT Solutions)
13 Jun 2022, 19:50:22

Array Elements (JS Arrays)

Category : JavaScript Tutorials

<!DOCTYPE html>
<html>
<head>
<title>JavaScript Code Testing</title>
</head>
<body>
<p id = "demo1"></p>
<p id = "demo2"></p>
<script>

var a = ["aaa", "bbb", "ccc", "ddd"];
a[0] = "eee";
document.getElementById("demo1").innerHTML = a;


var b = new Array("aaa", "bbb", "ccc", "ddd");
document.getElementById("demo2").innerHTML = b[2];
</script>
</body>
</html>

 
TNW (Web Service & ICT Solutions)
13 Jun 2022, 19:49:31

Adding Array Element (JS Arrays)

Category : JavaScript Tutorials

<!DOCTYPE html>
<html>
<head>
<title>JavaScript Code Testing</title>
</head>
<body>
<p id = "demo">forEach Loop</p>
<script>
var cities, text;
cities = ["Yangon", "Mandalay", "Naypyidaw", "Meikhtila"];

text = "<ul>";
cities.forEach(jsFunction);
text+= "</ul>";

function jsFunction(value){
text += "<li>" + value + "</li>";
}

document.getElementById("demo").innerHTML = text;

</script>
</body>
</html>

 
TNW (Web Service & ICT Solutions)
13 Jun 2022, 19:48:42

Accessing the last element (JS Arrays)

Category : JavaScript Tutorials

<!DOCTYPE html>
<html>
<head>
<title>JavaScript Code Testing</title>
</head>
<body>
<p id = "demo">Accessing the last element</p>
<script>
var cities = ["Yangon", "Mandalay", "Naypyidaw", "Meikhtila"];
var last = cities[cities.length - 1];
document.getElementById("demo").innerHTML = last;
</script>
</body>
</html>

 
TNW (Web Service & ICT Solutions)
13 Jun 2022, 19:47:15

Unshift() (JS Array Methods)

Category : JavaScript Tutorials

<!DOCTYPE html>
<html>
<head>
<title>JavaScript Code Testing</title>
</head>
<body>
<p id = "demo">Deleting Element</p>
<button type = "button" onclick = "jsFunction()">Remove</button>
<script>
var cities = ["Yangon", "Mandalay", "Naypyidaw", "Meikhtila"];
document.getElementById("demo").innerHTML = cities.join(" * ");

function jsFunction(){
cities.unshift("Bagan");
document.getElementById("demo").innerHTML = cities.join(" * ");
}
</script>
</body>
</html>

 
TNW (Web Service & ICT Solutions)
13 Jun 2022, 19:46:34

Shift() (JS Array Methods)

Category : JavaScript Tutorials

<!DOCTYPE html>
<html>
<head>
<title>JavaScript Code Testing</title>
</head>
<body>
<p id = "demo">Deleting Element</p>
<button type = "button" onclick = "jsFunction()">Remove</button>
<script>
var cities = ["Yangon", "Mandalay", "Naypyidaw", "Meikhtila"];
document.getElementById("demo").innerHTML = cities.join(" * ");

function jsFunction(){
cities.shift();
document.getElementById("demo").innerHTML = cities.join(" * ");
}
</script>
</body>
</html>

 
TNW (Web Service & ICT Solutions)
13 Jun 2022, 19:46:00

Push() (JS Array Methods)

Category : JavaScript Tutorials

<!DOCTYPE html>
<html>
<head>
<title>JavaScript Code Testing</title>
</head>
<body>
<p id = "demo">Adding Element</p>
<button type = "button" onclick = "jsFunction()">Add</button>
<script>
var cities = ["Yangon", "Mandalay", "Naypyidaw", "Meikhtila"];
document.getElementById("demo").innerHTML = cities.join(" * ");

function jsFunction(){
cities.push("Bagan");
document.getElementById("demo").innerHTML = cities.join(" * ");
}
</script>
</body>
</html>

 
TNW (Web Service & ICT Solutions)
13 Jun 2022, 19:45:18

Pop() (JS Array Methods)

Category : JavaScript Tutorials

<!DOCTYPE html>
<html>
<head>
<title>JavaScript Code Testing</title>
</head>
<body>
<p id = "demo">Deleting Element</p>
<button type = "button" onclick = "jsFunction()">Delete</button>
<script>
var cities = ["Yangon", "Mandalay", "Naypyidaw", "Meikhtila"];
document.getElementById("demo").innerHTML = cities.join(" * ");

function jsFunction(){
cities.pop();
document.getElementById("demo").innerHTML = cities.join(" * ");
}
</script>
</body>
</html>

 
TNW (Web Service & ICT Solutions)
13 Jun 2022, 19:44:28

Converting to String (JS Array Methods)

Category : JavaScript Tutorials

<!DOCTYPE html>
<html>
<head>
<title>JavaScript Code Testing</title>
</head>
<body>
<p id = "demo1"></p>
<p id = "demo2"></p>
<script>
var cities = ["Yangon", "Mandalay", "Naypyidaw", "Meikhtilar"];
document.getElementById("demo1").innerHTML = cities.toString();

document.getElementById("demo2").innerHTML = cities.join(" * ");
</script>
</body>
</html>

 
TNW (Web Service & ICT Solutions)
12 Jun 2022, 15:50:24

Objects (JS Numbers)

Category : JavaScript Tutorials

<!DOCTYPE html>
<html>
<head>
<title>JavaScript Numbers</title>
</head>
<body>
<p id = "demo1"></p>
<p id = "demo2"></p>
<p id = "demo3"></p>
<p id = "demo4"></p>
<script>
var x = 9;
var y = new Number(9);
document.getElementById("demo1").innerHTML = typeof(x) + "<br />" + typeof(y);

document.getElementById("demo2").innerHTML =…

 
TNW (Web Service & ICT Solutions)
12 Jun 2022, 15:49:51

NaN (JS Numbers)

Category : JavaScript Tutorials

<!DOCTYPE html>
<html>
<head>
<title>JavaScript Numbers</title>
</head>
<body>
<p id = "demo1"></p>
<p id = "demo2"></p>
<p id = "demo3"></p>
<p id = "demo4"></p>
<p id = "demo5"></p>
<script>
document.getElementById("demo1").innerHTML = 100 / "String";
document.getElementById("demo2").innerHTML = 100 / "10";
var x = 100 /…

 
TNW (Web Service & ICT Solutions)
12 Jun 2022, 15:49:16

Infinity (JS Numbers)

Category : JavaScript Tutorials

<!DOCTYPE html>
<html>
<head>
<title>JavaScript Numbers</title>
</head>
<body>
<p id = "demo"><p>
<script>
var num = 2;
var val = "";
while(num != Infinity){
num = num * num;
val = val + num + "<br />";
document.getElementById("demo").innerHTML = val;
}
</script>
</body>
</html>

 
TNW (Web Service & ICT Solutions)
12 Jun 2022, 15:48:32

valueOf() (JS Number Methods)

Category : JavaScript Tutorials

<!DOCTYPE html>
<html>
<head>
<title>JavaScript Code Testing</title>
</head>
<body>
<p id = "demo"></p>
<script>
var x = 246;
document.getElementById("demo").innerHTML = x.valueOf() + "<br />" + (246).valueOf() + "<br />" + (246 + "10").valueOf();
</script>
</body>
</html>

 
TNW (Web Service & ICT Solutions)
12 Jun 2022, 15:47:59

toString() (JS Number Methods)

Category : JavaScript Tutorials

<!DOCTYPE html>
<html>
<head>
<title>JavaScript Number Methods</title>
</head>
<body>
<p id = "demo"></p>
<script>
var x = 50;
document.getElementById("demo").innerHTML = x.toString() + "<br />" +
(50 + 40).toString() + "<br />" +
(50 + "40").toString();
</script>
</body>
</html>

 
TNW (Web Service & ICT Solutions)
12 Jun 2022, 15:47:26

toPrecision() (JS Number Methods)

Category : JavaScript Tutorials

<!DOCTYPE html>
<html>
<head>
<title>JavaScript Number Methods</title>
</head>
<body>
<p id = "demo"></p>
<script>
var x = 5.937;
document.getElementById("demo").innerHTML = x.toPrecision() + "<br />" + x.toPrecision(1)+ "<br />" + x.toPrecision(3);

</script>
</body>
</html>

 
TNW (Web Service & ICT Solutions)
12 Jun 2022, 15:46:40

toFixed() (JS Number Methods)

Category : JavaScript Tutorials

<!DOCTYPE html>
<html>
<head>
<title>JavaScript Number Methods</title>
</head>
<body>
<p id = "demo"></p>
<script>
var x = 5.937;
document.getElementById("demo").innerHTML = x.toFixed() + "<br />" + x.toFixed(2) + "<br />" + x.toFixed(3);

</script>
</body>
</html>

 
TNW (Web Service & ICT Solutions)
12 Jun 2022, 15:46:04

toExponential() (JS Number Methods)

Category : JavaScript Tutorials

<!DOCTYPE html>
<html>
<head>
<title>JavaScript Number Methods</title>
</head>
<body>
<p id = "demo"></p>
<script>
var x = 590000.937;
document.getElementById("demo").innerHTML = x.toExponential() + "<br />" +
x.toExponential(2) + "<br />" +
x.toExponential(4) + "<br />" +
x.toExponential (5);

 
TNW (Web Service & ICT Solutions)
12 Jun 2022, 15:44:56

parseInt (JS Number Methods)

Category : JavaScript Tutorials

<!DOCTYPE html>
<html>
<head>
<title>JavaScript Code Testing</title>
</head>
<body>
<p id = "demo"></p>
<script>
document.getElementById("demo").innerHTML =
parseInt(true) + "<br />" +
parseInt(false) + "<br />" +
parseInt(" 34 ") + "<br />" +
parseInt (" 24.02 ") +…

 
TNW (Web Service & ICT Solutions)
12 Jun 2022, 15:44:18

parseFloat() (JS Number Methods)

Category : JavaScript Tutorials

<!DOCTYPE html>
<html>
<head>
<title>JavaScript Code Testing</title>
</head>
<body>
<p id = "demo"></p>
<script>
document.getElementById("demo").innerHTML =
parseFloat(true) + "<br />" +
parseFloat(false) + "<br />" +
parseFloat(" 34 ") + "<br />" +
parseFloat (" 24.02 ") +…

 
TNW (Web Service & ICT Solutions)
12 Jun 2022, 15:43:33

Number (JS Number Methods)

Category : JavaScript Tutorials

<!DOCTYPE html>
<html>
<head>
<title>JavaScript Code Testing</title>
</head>
<body>
<p id = "demo"></p>
<script>
document.getElementById("demo").innerHTML =
Number(true) + "<br />" +
Number(false) + "<br />" +
Number(" 34 ") + "<br />" +
Number (" 24.02 ") +…

 
TNW (Web Service & ICT Solutions)
12 Jun 2022, 15:42:46

Number Properties (JS Number Methods)

Category : JavaScript Tutorials

<!DOCTYPE html>
<html>
<head>
<title>JavaScript Code Testing</title>
</head>
<body>
<p id = "demo"></p>
<script>
document.getElementById("demo").innerHTML =
parseFloat(true) + "<br />" +
parseFloat(false) + "<br />" +
parseFloat(" 34 ") + "<br />" +
parseFloat (" 24.02 ") +…

 
TNW (Web Service & ICT Solutions)
11 Jun 2022, 09:58:52

trim (JS String Methods)

Category : JavaScript Tutorials

<!DOCTYPE html>
<html>
<head>
<title>JavaScript String Methods</title>
</head>
<body>
<p id = "demo">Trim Testing</p>
<button type = "button" onclick = "jsFunction()">Try Now</buttton>
<script>
function jsFunction(){
var str = " I am Thet Naing Win.";
var trm = str.trim();
alert(trm);
}
</script>
</body>
</html>

 
TNW (Web Service & ICT Solutions)
11 Jun 2022, 09:58:18

toUpperCase (JS String Methods)

Category : JavaScript Tutorials

<!DOCTYPE html>
<html>
<head>
<title>JavaScript String Methods</title>
</head>
<body>
<p id = "demo">toUpperCase() Testing</p>
<button type = "button" onclick = "jsFunction()">Try Now</button>
<script>
function jsFunction(){
var str = "Thet Naing Win";
var n = str.toUpperCase();
document.getElementById("demo").innerHTML = n;
}
</script>
</body>
</html>

 
TNW (Web Service & ICT Solutions)
11 Jun 2022, 09:57:48

toLowerCase (JS String Methods)

Category : JavaScript Tutorials

<!DOCTYPE html>
<html>
<head>
<title>JavaScript String Methods</title>
</head>
<body>
<p id = "demo">toLowerCase() Testing</p>
<button type = "button" onclick = "jsFunction()">Try Now</button>
<script>
function jsFunction(){
var str = "Thet Naing Win";
var n = str.toLowerCase();
document.getElementById("demo").innerHTML = n;
}
</script>
</body>
</html>

 
TNW (Web Service & ICT Solutions)
11 Jun 2022, 09:57:10

substring (JS String Methods)

Category : JavaScript Tutorials

<!DOCTYPE html>
<html>
<head>
<title>JavaScript String Methods</title>
</head>
<body>
<p id = "demo">Substring Testing</p>
<button type = "button" onclick = "jsFunction()">Try Now</button>
<script>
function jsFunction(){
var str = "Thet, Naing, Win";
var res = str.substring(6, 11);
document.getElementById("demo").innerHTML = res;
}
</script>
</body>
</html>

 
TNW (Web Service & ICT Solutions)
11 Jun 2022, 09:56:23

slice (JS String Methods)

Category : JavaScript Tutorials

<!DOCTYPE html>
<html>
<head>
<title>JavaScript String Methods</title>
</head>
<body>
<p id = "demo">Slice Testing</p>
<button type = "button" onclick = "jsFunction()">Try Now</button>
<script>
function jsFunction(){
var str = "Thet, Naing, Win";
var res = str.slice(6, 11);
document.getElementById("demo").innerHTML = res;
}
</script>
</body>
</html>

 
TNW (Web Service & ICT Solutions)
11 Jun 2022, 09:55:54

search (JS String Methods)

Category : JavaScript Tutorials

<!DOCTYPE html>
<html>
<head>
<title>JavaScript String Methods</title>
</head>
<body>
<p id = "demo">Search Testing</p>
<button type = "button" onclick = "jsFunction()">Check Position</button>
<script>
function jsFunction(){
var str = "Hi, 'how' are you? I am Thet Naing Win. Good to see…

 
TNW (Web Service & ICT Solutions)
11 Jun 2022, 09:55:16

replace (JS String Methods)

Category : JavaScript Tutorials

<!DOCTYPE html>
<html>
<head>
<title>JavaScript String Methods</title>
</head>
<body>
<p id = "demo">Replace Testing</p>
<button type = "button" onclick = "jsFunction()">Try Now</button>
<script>
function jsFunction(){
var str = "Thet Naing Win";
var n = str.replace("Thet", "Michael");
document.getElementById("demo").innerHTML = n;
}
</script>
</body>
</html>

 
TNW (Web Service & ICT Solutions)
11 Jun 2022, 09:53:28

length (JS String Methods)

Category : JavaScript Tutorials


<!DOCTYPE html>
<html>
<head>
<title>String Methods</title>
</head>
<body>
<p id = "demo">JavaScript Code Testing</p>
<button type = "button" onclick = "jsFunction()">Check Length</button>
<script>
function jsFunction(){
var str = "Hi, how are you? I am Thet Naing Win. Good to see…

 
TNW (Web Service & ICT Solutions)
11 Jun 2022, 09:51:51

lastIndexOf (JS String Methods)

Category : JavaScript Tutorials

<!DOCTYPE html>
<html>
<head>
<title>JavaScript String Methods</title>
</head>
<body>
<p id = "demo">lastIndexOf Testing</p>
<button type = "button" onclick = "jsFunction()">Check Position</button>
<script>
function jsFunction(){
var str = "Hi, 'how' are you? I am Thet Naing Win. Good to see…

 
TNW (Web Service & ICT Solutions)
11 Jun 2022, 09:48:09

indexOf (JS String Methods)

Category : JavaScript Tutorials

<!DOCTYPE html>
<html>
<head>
<title>JavaScript String Methods</title>
</head>
<body>
<p id = "demo">indexOf Testing</p>
<button type = "button" onclick = "jsFunction()">Check Position</button>
<script>
function jsFunction(){
var str = "Hi, 'how' are you? I am Thet Naing Win. Good to see…

 
TNW (Web Service & ICT Solutions)
11 Jun 2022, 09:47:07

concat (JS String Methods)

Category : JavaScript Tutorials

<!DOCTYPE html>
<html>
<head>
<title>JavaScript String Methods</title>
</head>
<body>
<p id = "demo">concat Testing</p>
<button type = "button" onclick = "jsFunction()">Try Now</button>
<script>
function jsFunction(){
var str1 = "Hello";
var str2 = "How are you?";
var str = str1.concat ("! " ,…

 
TNW (Web Service & ICT Solutions)
2022-05-20 22:30:21

JS Outputs

Category : JavaScript Tutorials

<!DOCTYPE html>
<html>
<head>
<title>JavaScript OutPut</title>
</head>
<body>
<p>alert</p>
<button type = "button" onclick = "jsAlert()">Try Now</button>

<p>console.log</p>
<button type = "button" onclick = "jsConsole()">Try Now</button>

<p>document.write</p>
<button type = "button" onclick = "jsWrite()">Try Now</button>

<p id = "demo">innerHTML</p>
<button type = "button"…

 
TNW (Web Service & ICT Solutions)
2020-04-28 11:19:54

JS Constant

Category : JavaScript Tutorials

Example 1

<html>
<head>
<title>JS Constant</title>
</head>
<body>
<p id = "demo"></p>
<script>
const x = (x, y) => x * y;
document.getElementById("demo").innerHTML = x(8, 8);
</script>
</body>
</html>



Example 2

<html>
<head>
<title>JS Constant</title>
</head>
<body>
<p id = "demo"></p>
<script>
const x = (x, y, z) =>…

 
TNW (Web Service & ICT Solutions)
2020-04-28 11:00:06

JS Arguments

Category : JavaScript Tutorials

<html>
<head>
<title>JS Arguments</title>
</head>
<body>
<p id = "demo"></p>
<script>
function jsArgu(){
return arguments.length;
}
document.getElementById("demo").innerHTML = jsArgu(9, 4, 5, 8, 1000);
</script>
</body>
</html>

 
TNW (Web Service & ICT Solutions)
2020-04-26 12:50:48

Adding and Reduction Function

Category : JavaScript Tutorials

<html>
<head>
<title>Adding and Reducing Function</title>
</head>
<body>
<p id = "demo"></p>
<button type = "button" onclick = "addFun()">+</button>
<button type = "button" onclick = "redFun()">-</button>
<script>
var counter…			

 
TNW (Web Service & ICT Solutions)
2020-04-26 12:35:22

Reduction Function

Category : JavaScript Tutorials

<html>
<head>
<title>Reducing Function</title>
</head>
<body>
<p id = "demo"></p>
<button type = "button" onclick = "redFun()">-</button>
<script>
var reduce = (function(){
var counter = 10;
return function(){
counter…			

 

Adding Function

Category : JavaScript Tutorials

<html>
<head>
<title>Adding Function</title>
</head>
<body>
<p id = "demo"></p>
<button type = "button" onclick = "addFun()">+</button>
<script>
var add = (function(){
var counter = 0;
return function(){
counter…			

 

Total Result of the numbers

Category : JavaScript Tutorials

<html>
<head>
<title>Total Result of the Numbers</title>
</head>
<body>
<p id = "demo"></p>
<script>
function findTotal(){
var total = 0;
for(i=0; i<arguments.length; i++){
total += arguments[i];
}
return total;…			

 

Finding The Minimum Number

Category : JavaScript Tutorials

<html>
<head>
<title>Finding the Minimum Number</title>
</head>
<body>
<p id = "demo"></p>
<script>
function findMin(){
var min = Infinity;
for(i=0; i<arguments.length; i++){
if(arguments[i]<min){
min = arguments[i];
}
}
return…			

 

Finding The Maximum Number

Category : JavaScript Tutorials

<html>
<head>
<title>Finding The Maximum Number</title>
</head>
<body>
<p id = "demo"></p>
<script>
function findMax(){
var max = - Infinity;
for(i = 0; i < arguments.length; i++){
if(arguments[i] >…			

 

JS Functions

Category : JavaScript Tutorials

Eg1.

<html>
<head>
<title>TNW (web Service & ICT Solutions)</title>
</head>
<body>
<script>
function funSum(num1, num2){
return num1 + num2;
}
document.getElementById("demo").innerHTML = funSum(5,5);
</script>
</body>
</html>


Eg2.

<html>
<head>
<title>TNW (Web Service & ICT Solutions)</title>
</head>
<body>
<p id = "demo"></p>
<button type = "button" onclick = "myFun()">Check Date</button>
<script>
function…

 

Popup message or window alert

Category : JavaScript Tutorials

1. Popout Box

<html>
<head>
<title>TNW (Web Service & ICT Solutions)</title>
</head>
<body>
<p><h1>TNW provides the best ICT Solutions for your business.</h1></p>
<p><h3>Please click <a href = "https:www.tnw87.site">here</a> if you want to know more details.</h3></p>
<script>
var txt…

 

Using external JS file in html

Category : JavaScript Tutorials

1. Create a new folder and name it. (eg. JavaScript Test)
2. Open text editor and write the following codes.

var txt = "<b>Welcome to TNW (Web Service &…			

 

Start writing JS codes

Category : JavaScript Tutorials

Adding script between <head> and </head>

<html>
<head>
<title>TNW (Web Service & ICT Solutions)</title>
<script>
var txt = "<b>Welcome to TNW (Web Service & ICT Solutions)!</b><br /><br /> TNW provides the best ICT Solutions…