Hướng dẫn how to show array data in html - cách hiển thị dữ liệu mảng trong html

var contacts =[];

function getInfo() {
    var firstName = prompt("Enter first name");
    var lastName = prompt("Enter last name");
    var emailId = prompt("Enter Email ID");
    var phoneNo = prompt("Enter Phone number");
    var fname, lname, email, phone;
    var person ={
        fname : firstName,
        lname : lastName,
        email : emailId,
        phone : phoneNo
    }
    contacts.push(person);  




for(i=0;i

Tôi chỉ muốn hiển thị các phần tử mảng mới. Trong mã trên, mỗi khi một phần tử mới vào mảng, tất cả các phần tử được hiển thị. Làm thế nào tôi có thể tránh lặp lại? Tôi nghĩ rằng sử dụng DOM là một tùy chọn. Tôi đang cố gắng thực hiện điều này.

Pixelomo

6.0634 Huy hiệu vàng46 Huy hiệu bạc57 Huy hiệu đồng4 gold badges46 silver badges57 bronze badges

Đã hỏi ngày 4 tháng 3 năm 2016 lúc 14:38Mar 4, 2016 at 14:38

Bạn có thể làm điều đó như thế này, chỉ thêm last element của array vào innerHTML

var contacts =[];

function getInfo() {
    var firstName = prompt("Enter first name");
    var lastName = prompt("Enter last name");
    var emailId = prompt("Enter Email ID");
    var phoneNo = prompt("Enter Phone number");
    var fname, lname, email, phone;
    var person ={
        fname : firstName,
        lname : lastName,
        email : emailId,
        phone : phoneNo
    };
    contacts.push(person);  


    document.getElementById("mydiv").innerHTML += contacts[contacts.length-1].fname+" "+contacts[contacts.length-1].lname;

}

Đã trả lời ngày 4 tháng 3 năm 2016 lúc 14:44Mar 4, 2016 at 14:44

Quá trình quy trìnhThe Process

5,8553 Huy hiệu vàng31 Huy hiệu bạc41 Huy hiệu đồng3 gold badges31 silver badges41 bronze badges

Trước khi bạn thêm tất cả các yếu tố bạn phải làm trống div của bạn.

document.getElementById("mydiv").innerHTML = ''

Đã trả lời ngày 4 tháng 3 năm 2016 lúc 14:45Mar 4, 2016 at 14:45

DCruz22DCruz22DCruz22

7961 Huy hiệu vàng8 Huy hiệu bạc18 Huy hiệu đồng1 gold badge8 silver badges18 bronze badges

Đây là một đoạn hoạt động của những gì bạn đã yêu cầu. Bạn chỉ cần lấy đối tượng được đẩy cuối cùng từ mảng và hiển thị tên.

Ngoài ra, var fname, lname, email, phone của bạn là không bắt buộc, bạn có thể đặt các thuộc tính đối tượng một cách nhanh chóng.

var contacts =[];

function getInfo() {
    var firstName = prompt("Enter first name");
    var lastName = prompt("Enter last name");
    var emailId = prompt("Enter Email ID");
    var phoneNo = prompt("Enter Phone number");
   // var fname, lname, email, phone; //also this is not required. you can set dynamic property names in a object.
    var person ={
        fname : firstName,
        lname : lastName,
        email : emailId,
        phone : phoneNo
    };
    contacts.push(person);  

    var currPerson = contacts[contacts.length-1]; //take the last pushed object from the array
    
    var lastNameFirstChar = currPerson.lname.charAt(0).toUpperCase();
  
    if(!document.getElementById(lastNameFirstChar + "_holder")){      
    document.getElementById("mydiv").innerHTML += "
"+lastNameFirstChar+"
";
    
  }
   document.getElementById(lastNameFirstChar + "_holder").innerHTML += currPerson.fname+" "+currPerson.lname + "
";
 

}

Get Person Info
----------------------------

EDIT: Vì bạn nói rằng bạn có thể sử dụng jQuery, tôi đã cập nhật giải pháp với jQuery. Since you said you can use Jquery I have updated the solution with Jquery.

Droidr

631 Huy hiệu vàng2 Huy hiệu bạc13 Huy hiệu đồng1 gold badge2 silver badges13 bronze badges

Đã trả lời ngày 4 tháng 3 năm 2016 lúc 15:12Mar 4, 2016 at 15:12

Rajshekar Reddyrajshekar ReddyRajshekar Reddy

18.4K3 Huy hiệu vàng38 Huy hiệu bạc59 Huy hiệu Đồng3 gold badges38 silver badges59 bronze badges

25

Chỉ là sự thay đổi:

if(contacts.length!=0){
   document.getElementById("mydiv").innerHTML += contacts[contacts.length-1].fname+" "+contacts[contacts.length-1].lname;
}

Kiểm tra nếu bắt đầu khi độ dài của mảng bằng không

Đã trả lời ngày 4 tháng 3 năm 2016 lúc 15:09Mar 4, 2016 at 15:09

Koustav Raykoustav RayKoustav Ray

1.06512 Huy hiệu bạc25 Huy hiệu đồng12 silver badges25 bronze badges