js php增删查,javascript实现信息增删改查的方法示例代码

这篇文章主要介绍了javascript实现信息增删改查的方法,实例分析了javascript操作页面元素实现针对页面信息的增删改查功能,具有一定参考借鉴价值,需要的朋友可以参考下

本文实例讲述了javascript实现信息增删改查的方法。分享给大家供大家参考。具体实现方法如下：

显示所有的用户界面

名称性别邮箱出生日期操作

用户名:
性别:	男 女
邮箱
出生日期:

window.onload = function(){

alert("onload");

document.getElementById("addu1").style.display = "none";

}

function selectAll(){

var users = document.getElementById("users");

var ips = users.getElementsByTagName("input");

var chbk = document.getElementById("chbk1");

for(var i=0;i

ips[i].setAttribute("checked",chbk.getAttribute("checked"));

}

}

function addUser(){

alert("add");

var name = document.getElementById("name").Value;

var sex = document.getElementById("sex").Value;

var email = document.getElementById("email").Value;

var bir = document.getElementById("bir").Value;

var tusers = document.getElementById("tusers").Value;

var tr1 = document.createElement("tr");

var cbk = document.createElement("td");

var tname = document.createElement("td");

var tsex = document.createElement("td");

var temail = document.createElement("td");

var tbir = document.createElement("td");

var toper = document.createElement("td");

var cbk1 = document.createElement("input");

cbk1.setAttribute("type","checkbox");

cbk1.setAttribute("name","chbk");

cbk.appendChild(cbk1);

tname.appendChild(document.createTextNode(name));

tsex.appendChild(document.createTextNode(sex));

temail.appendChild(document.createTextNode(email));

tbir.appendChild(document.createTextNode(bir));

var adelete = document.createElement("a");

var aupdate = document.createElement("a");

adelete.setAttribute("href","#");

aupdate.setAttribute("href","#");

adelete.appendChild(document.createTextNode("删除|"));

aupdate.appendChild(document.createTextNode("修改"));

toper.appendChild(adelete);

toper.appendChild(aupdate);

tr1.appendChild(cbk);

tr1.appendChild(tname);

tr1.appendChild(tsex);

tr1.appendChild(temail);

tr1.appendChild(tbir);

tr1.appendChild(toper);

var users = document.getElementById("users");

users.appendChild(tr1);

tusers.appendChild(users);

adelete.onclick = function(){

users.removeChild(adelete.parentNode.parentNode);

}

aupdate.onclick function(){

document.getElementById(addu).style.display = "none";

document.getElementById(addu1).style.display = "block";

var utr = aupdate.parentNode.parentNode;

var utrs = utr.childNodes;

document.getElementById("name").value = utrs[1].innerHTML;

document.getElementById("sex").value = utrs[2].innerHTML;

document.getElementById("email").value = utrs[3].innerHTML;

document.getElementById("bir").value = utrs[4].innerHTML;

var upUser = document.getElementById("upduser");

upUser.onclick = function(){

utr.childNodes[1].innerHTML = document.getElementById("name").value;

utr.childNodes[2].innerHTML = document.getElementById("sex").value;

utr.childNodes[3].innerHTML = document.getElementById("email").value;

utr.childNodes[4].innerHTML = document.getElementById("bir").value;

document.getElementById("addu1").style.display = "none";

document.getElementById("addu").style.display = "block";

}

}

testPage()

}

var indexPage = document.createElement("a");

var upPage = document.createElement("a");

var downPage = document.createElement("a");

var endPage = document.createElement("a");

var nowpage = 1;

function testPage(){

var tbodyUsers = document.getElementById("users");

var trUsers = document.getElementById("tr");

var countRecord = trUsers.length;

var PAGESIZE = 2;

var countPage = (countRecord%PAGESIZE ==0?countRecord/PAGESIZE:Math.ceil(countRecord/PAGESIZE));

var pages=document.getElementById("pages");

if(!pages.hasChildNodes()){

getPages(nowpage);

}

index.onclik=function(){

noepage=1;

indexPageInfo(countRecord,trUsers);

}

upPage.οnclick=function(){

if(nowpage-1>1){

nowpage-=1;

}else{

nowpage=1;

indexPageInfo(countRecord,trUsers);

}

var startindex =(nowpage-1)*PAGESIZE;

var endindex=startindex+PAGESIZE;

PageInfo(startindex,endindex,countRecord,trUsers);

}

downPage.οnclick=function(){

if(nowpage+1>=countPage){

nowpage=countPage;

}else{

nowpage=+1;

}

var startindex =(nowpage-1)*PAGESIZE;

var endindex=startindex+PAGESIZE;

PageInfo(startindex,endindex,countRecord,trUsers);

}

endPage.οnclick=function(){

if(nowpage>1){

var startindex =(nowpage-1)*PAGESIZE;

for(var i=0;i

if(i

trUsers[i].style.display="none";

}else{

trUsers[i].style.display="block";

}

}

}else{

indexPageInfo(countRecord,trUsers);

}

}

}

function indexPageInfo(countRecord, trUsers) {

if (countRecord <= 2) {

for ( var i = 0; i < PAGESIZE; i++) {

trUsers[i].style.display = "block";

}

} else {

for ( var i = 2; i < countRecord; i++) {

trUsers[i].style.display = "none";

}

}

}

function PageInfo(startindex, endindex, countRecord, trUsers) {

for ( var i = 0; i < countRecord; i++) {

if (i >= startindex && i < endindex) {

trUsers[i].style.display = "block";

} else {

trUsers[i].style.display = "none";

}

}

}

function getPages(numpage) {

indexPage.appendChild(document.createTextNode("首页"));

indexPage.setAttribute("href", "#");

upPage.appendChild(document.createTextNode("上一页"));

upPage.setAttribute("href", "#");

downPage.appendChild(document.createTextNode("下一页"));

downPage.setAttribute("href", "#");

endPage.appendChild(document.createTextNode("末页"));

endPage.setAttribute("href", "#");

var pages = document.getElementById("pages");

pages.appendChild(indexPage);

pages.appendChild(upPage);

pages.appendChild(downPage);

pages.appendChild(endPage);

}