slice method គឺជា method លុបទិន្ន័យចេញពី array ដែលយើងប្រើជាមួយ table list ដូចរូបភាពខាងក្រោមនេះ។ នេះគឺជា link សំរាប់រៀនលុប element របស់ javScript។
<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>
<th>Action</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>
<td><input type="button" value="Delete" class="delete"></td>
</tr>`
}
document.getElementById("table").innerHTML = data
let remove = document.querySelectorAll(".delete")
remove.forEach(function(e,i){
e.addEventListener("click",()=>{
myArray.splice(i,1)// i = index , 1 លុបម្តងមួយ
showText()
})
})
}
showText()
document.getElementById("b-add").addEventListener("click", ()=>{
myArray.push({"NAME":myName.value,"GENDER":gender.value, "AGE":age.value})
showText()
})
</script>
</html>
0 Comments