案例效果,输入数据点击入栈,则在多行文本框中显示数据,点击出栈则删除数组中最后一个数据,点击查看数组中的数据,则在多行文本框显示数组的所有数据。
<!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].οnclick=function()
{
a.push(text1[0].value);
wenben.value=a;
text1[0].value="";
}
text1[2].οnclick=function()
{
a.pop(text1[0].value);
wenben.value=a;
}
text1[3].οnclick=function()
{
wenben.value=a;
}
</script>
</html>