js对象注册清除

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<style>
.showTable{
border: 1px solid aquamarine;
width: 500px;
}
</style>
</head>
<script>
var peopArry=new Array();
var peopIndex=0;
function register(){
var peop=new Object();
peop.name=document.getElementById("name").value;
peop.age=document.getElementById("age").value;
peopArry[peopIndex]=peop;
peopIndex++;
}
function show(){
var peopData=document.getElementById("peopTbody");
var trData="<tr><td>"+peopArry[peopIndex-1].name+"</td><td>"+peopArry[peopIndex-1].age+"</td></tr>";
peopData.innerHTML=peopData.innerHTML+trData;
}
function clear(){
peopArry.splice(0,peopArry.length);
show();
}
function clearScr(){
var surData=document.getElementById("peopTbody");
surData.innerHTML="";
}
</script>
<body>
<table>
<div >
<table >
姓名:<input type="text" id="name"/>
年龄:<input type="text" id="age"/>
<input id="register" type="button" value="注册" onclick="register()"/>
<input id="show" type="button" value="显示" onclick="show()"/>
<input id="clear" type="button" value="清空" onclick="clear()"/>
<input id="clearScr" type="button" value="清屏" onclick="clearScr()"/>
</table>
</div>
<hr />
<div >
<table class="showTable" id="showTable" border="1">
<thead align="center" >
<tr>
<th >姓名</th><th >年龄</th>
</tr>
</thead>
<tbody id="peopTbody">
</tbody>
</table>
</div>
</body>
</html>
缺陷:清除数组中的元素后按显示按钮仍会显示注册信息。
js对象注册清除的更多相关文章
- [荐]使用Js操作注册表
使用Js操作注册表 要操作注册表需要通过ActiveX控件调用WScript.shell对象,通过该对象的一些方法来操作. WshShell对象:可以在本地运行程序.操纵注册表内容.创建快捷方式或访问 ...
- jQuery的文件引入、入口函数以及js对象和jquery对象之间的互相转换
JavaScript与jquery的区别 JavaScript是一门编程语言,用来编写客户端浏览器脚本. jQuery是javascript的一个库,包含多个可重用的函数,用来辅助简化javascri ...
- jquery实现点击展开列表同时隐藏其他列表 js 对象操作 对象原型操作 把一个对象A赋值给另一个对象B 并且对象B 修改 不会影响 A对象
这篇文章主要介绍了jquery实现点击展开列表同时隐藏其他列表的方法,涉及jquery鼠标事件及节点的遍历与属性操作技巧,具有一定参考借鉴价值,需要的朋友可以参考下 本文实例讲述了jquery实现点击 ...
- JS组件系列——表格组件神器:bootstrap table 包含了js对象的定义和对象成员函数的定义
前言:之前一直在忙着各种什么效果,殊不知最基础的Bootstrap Table用法都没有涉及,罪过,罪过.今天补起来吧.上午博主由零开始自己从头到尾使用了一遍Bootstrap Table ,遇到不少 ...
- JS判定注册表单的几个方式 及 Ajax进行用户名存在判定
最近感觉不赶紧把代码逻辑记一下梳理一下,再做的时候就容易进入"逻辑误区". 有个表单,简单点. <!DOCTYPE html> <!-- 注册表单验证,用户名格式 ...
- JS对象继承篇
JS对象继承篇 ECMAScript只支持实现继承,而且其实现继承主要是依靠原型链来实现的 原型链 其基本思路是利用原型让一个引用类型继承另一个引用类型的属性和方法 function Person() ...
- JS 对象封装的常用方式
JS是一门面向对象语言,其对象是用prototype属性来模拟的,下面,来看看如何封装JS对象. 常规封装 function Person (name,age,sex){ this.name = na ...
- JSON字符串和JS对象之间的转换
JSON字符串和JS对象之间的转换 1 json字符串转换为js对象 1.1 标准json格式字符串转换为Js对象 JSON字符串 str JSON.parse(str) eval(str) eva ...
- js 对象的_proto_
js 对象呢,有个属性叫_proto_,以前没听说过,也没关注,最近看这个原型,就被迫知道了这个东西,js 这里面的东西,真是规定的很奇怪,具体为啥也不知道,就测试发现的,对象的_proto_属性,和 ...
随机推荐
- 实现多线程的方式Runnable
package com.thread.runnable; /** * 实现多线程的方式有继承Thread类和实现Runnable接口两种方式 * 哪种方式更好呢?实现的方式由于继承的方式. * 原因: ...
- SpringBoot学习之启动报错【This application has no explicit mapping for /error.....】
今天做SpringBoot小例子,在请求controller层的时候出现如下问题. Whitelabel Error Page This application has no explicit map ...
- com.sun.jdi.InvocationException occurred invoking method 异常
参考链接:https://stackoverflow.com/questions/4123628/com-sun-jdi-invocationexception-occurred-invoking-m ...
- sqlite学习笔记10:C语言中使用sqlite之查询和更新数据
前面说到的 sqlite_exec() 中的第三个參数, SQLite 将为 sql 參数内运行的每一个 SELECT 语句中处理的每一个记录调用这个回调函数. 本节加入了两个函数.selectFro ...
- ActiveMQ(五) 转
package pfs.y2017.m11.mq.activemq.demo05; import javax.jms.Connection; import javax.jms.ConnectionFa ...
- POJ 2886 Who Gets the Most Candies?(树状数组+二分)
题目链接 注意题目中给的顺序是顺时针的,所以在数组中应该是倒着存的.左就是顺时针,右就是逆时针.各种调试之后,终于A了,很多种情况考虑情况. #include <cstring> #inc ...
- Java实现HttpClient发送GET、POST请求(https、http)
1.引入相关依赖包 jar包下载:httpcore4.5.5.jar fastjson-1.2.47.jar maven: <dependency> <groupId>o ...
- 验证外部系统是否成功调用SAP RFC的方法有几种?
- SWT.Shell
import org.eclipse.swt.widgets.Display; import org.eclipse.swt.widgets.Shell; public class SWT_Shell ...
- opencv直方图该怎么画
图像直方图是反映图像中像素分布特性的统计表,一般显示如下: 其中横坐标代表的是图像像素的种类,或者说是灰度级,纵坐标代表的是每一级灰度下像素数或者该灰度级下像素数在所有图像总像素数总所占的百分比. 直 ...