<!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…
<!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>
<!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…
<!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>
<!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>
<!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>
<!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…
<!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>
<!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>
<!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>
<!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>
<!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"…
<!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;…
<!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>
<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…
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>
<!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…
<!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…
<!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:…
<!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 + ":"…
