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));
};
};



疯汉三雄起了!





js中setInterval和setTimeout的使用.html
代码如下:






var time = 10;
var id = 0;
function gel(id) {
return document.getElementById(id);
}

function dectime() {
if (time > 0) {
time--;
gel("timespan").innerHTML = time;
} else {
//清除时针
clearInterval(id);
}
}

window.onload = function() {
id = setInterval(dectime, 1000);
};



倒计时秒



js检查输入是否为数字.html
代码如下:

window.onload= function() {
document.getElementById("btn1").onclick = function() {
var i = prompt("输入要判断的值");
//window.alert(i);
if (!isNaN(i)) {
window.alert("是数字");
} else {
window.alert("不是数字");
}
};
}







js动态获取、创建和删除节点.html
代码如下:






function gel(id) { return document.getElementById(id); }

window.onload = function () {
gel("btnProAdd").onclick = function () {
//在proList下面增加子节点
var linew = document.createElement("li");
linew.innerHTML = prompt("输入要新增的省份");
gel("proList").appendChild(linew);
//重新绑定所有的点击删除事件
DelLiOnClick();
};

//双击li子节点，删除它

function DelLiOnClick() {
//1.首先得到所有的子节点
var liNodes = gel("proList").childNodes;

for (var i = 0; i < liNodes.length; i++) {
liNodes[i].onclick = function () {
//alert(liNodes[i]).innerHTML;//因为onclick绑定的是匿名函数，所以i到这里永远只会是7
//下面是正确的删除方法, 使用this.因为触发onclick事件的永远是你选中的li
this.parentNode.removeChild(this);
};
}
}

};

js中setInterval和setTimeout的使用.html

代码如下:






var time = 10;
var id = 0;
function gel(id) {
return document.getElementById(id);
}

function dectime() {
if (time > 0) {
time--;
gel("timespan").innerHTML = time;
} else {
//清除时针
clearInterval(id);
}
}

window.onload = function() {
id = setInterval(dectime, 1000);
};



倒计时秒



js动态添加表格数据.html
代码如下:

var mailArr = [
{ "title": "一个c#问题", "name": "张三", "date": "2014-03-21" },
{ "title": "一个javascript问题", "name": "李四", "date": "2014-03-21" },
{ "title": "一个c问题", "name": "五五", "date": "2014-03-21" },
{ "title": "一个c++问题", "name": "赵六", "date": "2014-03-21" }
];

window.onload = function () {
var tab = document.getElementById("tb");
//把mailArr循环遍历方式以tr的方式加入表格中
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 = "";
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);
}

};