<!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对象注册清除的更多相关文章

  1. [荐]使用Js操作注册表

    使用Js操作注册表 要操作注册表需要通过ActiveX控件调用WScript.shell对象,通过该对象的一些方法来操作. WshShell对象:可以在本地运行程序.操纵注册表内容.创建快捷方式或访问 ...

  2. jQuery的文件引入、入口函数以及js对象和jquery对象之间的互相转换

    JavaScript与jquery的区别 JavaScript是一门编程语言,用来编写客户端浏览器脚本. jQuery是javascript的一个库,包含多个可重用的函数,用来辅助简化javascri ...

  3. jquery实现点击展开列表同时隐藏其他列表 js 对象操作 对象原型操作 把一个对象A赋值给另一个对象B 并且对象B 修改 不会影响 A对象

    这篇文章主要介绍了jquery实现点击展开列表同时隐藏其他列表的方法,涉及jquery鼠标事件及节点的遍历与属性操作技巧,具有一定参考借鉴价值,需要的朋友可以参考下 本文实例讲述了jquery实现点击 ...

  4. JS组件系列——表格组件神器:bootstrap table 包含了js对象的定义和对象成员函数的定义

    前言:之前一直在忙着各种什么效果,殊不知最基础的Bootstrap Table用法都没有涉及,罪过,罪过.今天补起来吧.上午博主由零开始自己从头到尾使用了一遍Bootstrap Table ,遇到不少 ...

  5. JS判定注册表单的几个方式 及 Ajax进行用户名存在判定

    最近感觉不赶紧把代码逻辑记一下梳理一下,再做的时候就容易进入"逻辑误区". 有个表单,简单点. <!DOCTYPE html> <!-- 注册表单验证,用户名格式 ...

  6. JS对象继承篇

    JS对象继承篇 ECMAScript只支持实现继承,而且其实现继承主要是依靠原型链来实现的 原型链 其基本思路是利用原型让一个引用类型继承另一个引用类型的属性和方法 function Person() ...

  7. JS 对象封装的常用方式

    JS是一门面向对象语言,其对象是用prototype属性来模拟的,下面,来看看如何封装JS对象. 常规封装 function Person (name,age,sex){ this.name = na ...

  8. JSON字符串和JS对象之间的转换

    JSON字符串和JS对象之间的转换 1 json字符串转换为js对象 1.1 标准json格式字符串转换为Js对象  JSON字符串 str JSON.parse(str) eval(str) eva ...

  9. js 对象的_proto_

    js 对象呢,有个属性叫_proto_,以前没听说过,也没关注,最近看这个原型,就被迫知道了这个东西,js 这里面的东西,真是规定的很奇怪,具体为啥也不知道,就测试发现的,对象的_proto_属性,和 ...

随机推荐

  1. PJzhang:python基础入门的7个疗程-two

    猫宁!!! 参考链接:易灵微课-21天轻松掌握零基础python入门必修课-售价29元人民币 https://www.liaoxuefeng.com/wiki/1016959663602400 htt ...

  2. tomcat 实现域名crm.test.com訪问

    **tomcat 上下文.实现的效果.是在浏览器输入ip或者域名能直接訪问.不用输入项目project名字 正常初始化都是http://10.243.12.34:8080/plcrm.要变成 crm. ...

  3. Python——类的高级主题

    介绍关于类的一些高级主题,这些是可选的,在Python应用程序中,不会常常遇到. =========================================================== ...

  4. 01背包+卡精度 Hdu 2955

    <span style="color:#3333ff;">/* ---------------------------------------------------- ...

  5. linux输入子系统(5) - 学习框架

    注:本系列转自: http://www.ourunix.org/post/290.html input子系统学习系列文章,是我在实际开发过程中遇到也是必须啃下去的第一个Linux驱动,所以有必要记载下 ...

  6. Vue生命周期方法。

  7. visual studio 2013 update 3正式版出来了

    微软的更新速度还是蛮快的吗.新版本号出来了,大家快下载体验一下吧,详细下载地址在http://www.visualstudio.com/zh-cn/downloads/download-visual- ...

  8. 序列化模块 json pickel shelve

    一.json  模块 1.定义 将字典.列表等内容转换成字符串的过程就是序列化. 操作的数据类型有限,但是可以支持所有编程语言操作. 2.为什么要有序列化? 1.以某种存储形式使自定义对象持久化. 2 ...

  9. OOalv 实现带出栏位描述

    .类定义 CLASS lcl_event_handler DEFINITION. PUBLIC SECTION. METHODS: handle_data_changed_finished FOR E ...

  10. JS判断按时间跳转到相应的页面

    <!--时间段跳转js--><script language="javaScript" type="text/javascript"> ...