JS decoding and Coding-html
Copy Code code as follows:
<! DOCTYPE html>
<meta http-equiv= "Con Tent-type "content=" text/html; Charset=utf-8 "/>
<title>javascript encoding and decoding </title>
<script type=" Text/javascript ">
function Gel (id) {
return document.getElementById (ID);
}
Window.onload = function () {
//alert (document.getElementById ("Span1"). InnerHTML
Gel ("Btn1"). onclick = function () {
Alert (encodeURI Gel ("Span1"). InnerHTML));
};
Gel ("btn2"). onclick = function () {
Alert (decodeURI (Gel ("Span1"). InnerHTML));
};
};
</script>
<body>
<span id= "Span1" > Crazy han san xiong up!</span>
<inp UT type= "button" id= "BTN1" value= "encoded"/>
<input type= "button" id= "Btn2" value= "after decoding"/>
</body>
Use of SetInterval and settimeout in JS. html
Copy Code code as follows:
<! DOCTYPE html>
<meta http-equiv= "Content-type" content= "text/html; Charset=utf-8 "/>
Use of SetInterval and settimeout in <title>js </title>
<script type= "Text/javascript" >
var time = 10;
var id = 0;
function Gel (ID) {
return document.getElementById (ID);
}
function Dectime () {
if (Time > 0) {
time--;
Gel ("TimeSpan"). InnerHTML = time;
} else {
Clear the hour hand
Clearinterval (ID);
}
}
Window.onload = function () {
id = setinterval (dectime, 1000);
};
</script>
<body>
<span > Countdown <span id= "TimeSpan" style= "color:red" ></span> sec </span>
</body>
JS Check whether the input is a number. html
Copy Code code as follows:
<! DOCTYPE html>
<meta http-equiv= "Content-type" content= "text/html; Charset=utf-8 "/>
<TITLE>JS Check whether the input is digital </title>
<script type= "Text/javascript" >
window.onload= function () {
document.getElementById ("Btn1"). onclick = function () {
var i = prompt ("Enter the value to be judged");
Window.alert (i);
if (!isnan (i)) {
Window.alert ("is a number");
} else {
Window.alert ("Not a number");
}
};
}
</script>
<body>
<input type= "button" id= "BTN1" value= "Judge number"/>
</body>
JS dynamically gets, creates, and deletes nodes. html
Copy Code code as follows:
<! DOCTYPE html>
<meta http-equiv= "Content-type" content= "text/html; Charset=utf-8 "/>
<title>js dynamically acquire, create, and delete nodes </title>
<script type= "Text/javascript" >
function Gel (ID) {return document.getElementById (ID);}
Window.onload = function () {
Gel ("Btnproadd"). onclick = function () {
Add child nodes under Prolist
var linew = document.createelement ("Li");
linew.innerhtml = Prompt ("Enter the province to be added");
Gel ("Prolist"). AppendChild (linew);
Re-bind all click Delete Events
Dellionclick ();
};
Double-click the Li child node to delete it
function Dellionclick () {
1. Get all the child nodes first
var linodes = Gel ("Prolist"). ChildNodes;
for (var i = 0; i < linodes.length; i++) {
Linodes[i].onclick = function () {
Alert (Linodes[i]). innerhtml;//because the onclick bound is an anonymous function, so I'll always be 7 here.
Here is the correct deletion method, using this. Because the OnClick event is always triggered by your chosen li.
This.parentNode.removeChild (this);
};
}
}
};
</script>
<body>
<ul id= "Prolist" >
<li> Shanxi </li>
<li> Henan </li>
<li> Beijing </li>
</ul>
<input type= "button" value= "New province" id= "Btnproadd"/>
</body>
Use of SetInterval and settimeout in JS. html
Copy Code code as follows:
<! DOCTYPE html>
<meta http-equiv= "Content-type" content= "text/html; Charset=utf-8 "/>
Use of SetInterval and settimeout in <title>js </title>
<script type= "Text/javascript" >
var time = 10;
var id = 0;
function Gel (ID) {
return document.getElementById (ID);
}
function Dectime () {
if (Time > 0) {
time--;
Gel ("TimeSpan"). InnerHTML = time;
} else {
Clear the hour hand
Clearinterval (ID);
}
}
Window.onload = function () {
id = setinterval (dectime, 1000);
};
</script>
<body>
<span > Countdown <span id= "TimeSpan" style= "color:red" ></span> sec </span>
</body>
JS dynamically add table data. html
Copy Code code as follows:
<! DOCTYPE html>
<meta http-equiv= "Content-type" content= "text/html; Charset=utf-8 "/>
<title> Add table Data dynamically </title>
<script type= "Text/javascript" >
var Mailarr = [
{"title": "A C # problem", "name": "John", "date": "2014-03-21"},
{"title": "A JavaScript problem", "name": "Dick", "date": "2014-03-21"},
{"title": "A C Problem", "name": "55", "date": "2014-03-21"},
{"title": "A C + + problem", "name": "Zhao Liu", "date": "2014-03-21"}
];
Window.onload = function () {
var tab = document.getElementById ("TB");
The Mailarr loop traversal method is added to the table in a TR manner
for (var rowindex = 0; rowindex < mailarr.length; rowindex++) {
var tr = document.createelement ("tr");
var Th1 = document.createelement ("th");
var Th2 = document.createelement ("th");
var th3 = document.createelement ("th");
var Th4 = document.createelement ("th");
th1.innerhtml = "<input type= ' checkbox '/>";
th2.innerhtml = Mailarr[rowindex].title;
th3.innerhtml = Mailarr[rowindex].name;
th4.innerhtml = mailarr[rowindex].date;
Tr.appendchild (Th1);
Tr.appendchild (Th2);
Tr.appendchild (TH3);
Tr.appendchild (TH4);
Tab.appendchild (TR);
}
};
</script>
<body>
<table id= "TB" border= "1px;" style= "border-collapse:collapse;" >
<tr>
<th> Series </th>
<th> title </th>
<th> Email Person </th>
<th> Sending Time </th>
</tr>
<!--cycle increased-->
</table>
</body>
