JavaScript array functions push

In this Tutorial we want to describe you a code that makes you easy to
understand array function push. The code show you a HTML Page specifying name, text
field, push and pop button. An array variable instantiate array object, further this
object is used to hold the element. On click a push button, a function
push is invoked. The push function evaluate that if the value entered by a
user in a text field is null, an alert message box displayed with message" Name
is empty". Otherwise the value entered by the user in the text field is assigned
to an array and the count variable show you the number of element added to an
array. function show ( ) is invoked ,this function display you all the element
in the array, the for loop run and execute the code till the variable i is less
than count. The if check the condition, incase the array length is more than zero, the
browser display you all the element of string.
document.getElementById - This display you all the element on the
basis of respective Id.
In the same way pop ( )function is invoked. This function include a variable
count ,if count is zero, an alert message box is displayed showing array is empty, if
there is an element in an array, this count-- will erase the element from an array. again
the same show ( ) is invoked that print the list of element after a pop
function is invoked.
push function.html
<html>
<head>
<title>push function</title>
<script>
var array = new Array();
var count = 0;
function push(val){
if(val=="")
alert("Name is emplty")
else {
array[count]=val;
count++;
}
}
function pop(){
if(count==0) {
alert("Array is empty");
} else {
count--;
}
}
function show() {
var string="<b>All Element of the Array :</b><br>";
for(i = 0; i < count; i++) {
string =string+array[i]+"<br>";
}
if(array.length > 0)
document.getElementById('myDiv').innerHTML = string;
}
</script>
</head>
<body>
<h2>javascript array functions push</h2>
<form name="form1">
<table width="407">
<tr>
<td width="154" align="right"><b>Name</b></td>
<td width="9"><b> :</b></td>
<td width="224">
<input type="text" name="name"/></td>
</tr>
<tr>
<td width="154" align="right"> </td>
<td width="9"> </td>
<td width="224"> </td>
</tr>
<tr>
<td width="154" align="right"> </td>
<td width="9"> </td>
<td width="224">
<input type="button" Value="Push"
onclick="push(this.form.name.value),show();"/>
<input type="button" Value="Pop"
onclick="pop(),show();"/>
</td>
</tr>
</table>
</form>
<div id="myDiv"></div>
</body>
</html>
|
Output
After insert value

Download Code

|