pop() method
pop គឺជា method ដែល remove ទិន្ន័យចុងក្រោយរបស់ array
</head>
<style>
table{
width: 100%;
}
table, th{
border: 1px solid black;
border-collapse: collapse;
}
td{
border-right: 1px solid black;
}
#b-remove{
background-color: red;
border-radius: 5px;
color: white;
margin-top: 10px;
padding: 5px
}
</style>
<body>
<table>
<tr>
<th>NAME</th>
<th>GENDER</th>
<th>AGE</th>
</tr>
<tbody id="table">
</tbody>
</table>
<input type="button" value="Remove" id="b-remove">
</body>
<script>
var myArray = [{"NAME":"Ros DUL", "AGE":20, "GENDER": "M"},
{"NAME":"Keo", "AGE":18, "GENDER": "F"},
{"NAME":"Seng", "AGE":25, "GENDER": "F"},
{"NAME":"Dinna", "AGE":15, "GENDER": "M"},
{"NAME":"Phors", "AGE":30, "GENDER": "F"},
{"NAME":"Veas Sna", "AGE":23, "GENDER": "F"},]
function showText(){
var data = ""
for(i of myArray){
data += `<tr>
<td>${i.NAME}</td>
<td>${i.GENDER}</td>
<td>${i.AGE}</td>
</tr>`
}
document.getElementById("table").innerHTML = data
}
showText()
document.getElementById("b-remove").addEventListener("click", function(){
myArray.pop()
showText()
})
</script>
</html>
push() method
push method គឺសំរាប់បញ្ចូលទិន្ន័យជា array ទៅកាន់ variable array
<body>
<label for="gender">Name:</label><input type="text" name="Name" id="n">
<label for="gender">Gender:</label><input type="text" name="gender" id="gd">
<label for="age">Age:</label><input type="text" name="age" id="age">
<input type="button" value="Add" id="b-add">
<table>
<tr>
<th>NAME</th>
<th>GENDER</th>
<th>AGE</th>
</tr>
<tbody id="table">
</tbody>
</table>
</body>
<script>
var myArray = []
var myName = document.getElementById("n")
var gender = document.getElementById("gd")
var age = document.getElementById("age")
function showText(){
var data = ""
for(i of myArray){
data += `<tr>
<td>${i.NAME}</td>
<td>${i.GENDER}</td>
<td>${i.AGE}</td>
</tr>`
}
document.getElementById("table").innerHTML = data
}
showText()
document.getElementById("b-add").addEventListener("click", ()=>{
myArray.push({"NAME":myName.value,"GENDER":gender.value, "AGE":age.value})
showText()
})
</script>
</html>
0 Comments