JaveScript之数组实训案例

来源：互联网发布：php7不支持mysql 编辑：程序博客网时间：2024/06/04 18:28

案例效果，输入数据点击入栈，则在多行文本框中显示数据，点击出栈则删除数组中最后一个数据，点击查看数组中的数据，则在多行文本框显示数组的所有数据。

<!DOCTYPE html>

<html>
<head>
<meta charset="UTF-8">
<title></title>
<style type="text/css">
#text{
width: 100px;
}
#text1{
width: 150px;
height: 60px;
}
</style>
</head>
<body>
<span>请输入要入栈的数据:</span>
<input type="text" value="" id="text"/><br /><br />
<input type="button" value="入栈" />
<input type="button" value="出栈" />
<input type="button" value="查看数组中的数据" /><br /><br />

<textarea rows="10" cols="20" id="dh"></textarea>
</body>
<script type="text/javascript">
var text1=document.getElementsByTagName("input");
var a=[];
var wenben=document.getElementById("dh");

text1[1].onclick=function()
{
a.push(text1[0].value);
wenben.value=a;
text1[0].value="";
}

text1[2].onclick=function()
{
a.pop(text1[0].value);
wenben.value=a;
}

text1[3].onclick=function()
{
wenben.value=a;
}
</script>

</html>

阅读全文

0 0