Hiển thị một mảng trong html

document.write sẽ chỉ ghi đè lên bất cứ thứ gì có trong thẻ và bắt đầu lại từ đầu, vì vậy nó không hữu ích lắm ở đây. Cách tiếp cận của bạn với ________ 10 [lưu ý, không phải “getElementbyId”. ] thực sự không sao, nhưng vì bạn đang gán giá trị do

1 trả về cho

của thuộc tính

2, thì hàm

1 của bạn thực sự nên

4 một giá trị. Bạn có thể làm điều đó như thế này.

function register[]{
    // caution: drop the "new Array" part or it won't work!
    var ids = ['name','lname','email','password','cpassword'];
    var printThis = "";
    for[var i = 0; i < ids.length; i++]{
        printThis += "
"+ids[i];
    }
    return printThis; //  const div = document.querySelector["div#lesson-ex"];
undefined
> div;

> const p1 = document.createElement["p"];
undefined
> const p2 = document.createElement["p"];
undefined
> const p3 = document.createElement["p"];
undefined
> div.append[p1, p2, p3];

Tuyệt quá. Bây giờ chúng tôi có ba thẻ P trống mà chúng tôi có thể sử dụng để in nội dung của ba mảng. Tiếp theo, hãy tạo một vài mảng và thử xuất chúng bên dưới

> const numAr = [2,4,6,8];
> const stringAr = ["Rhino", "Hippo", "Dingo", "Dodo", "Flamingo"];
> const morePrimitives = [true, false, undefined, null];

Bây giờ, hãy thử in chúng ra đầu ra bên dưới

> p1.innerText = numAr;
> p2.innerText = stringAr;
> p3.innerText = morePrimitives;

Như chúng ta sẽ thấy bên dưới trong phần đầu ra cũng như trong hình ảnh tiếp theo, nội dung của mảng được in ra và mỗi phần tử được phân tách bằng dấu phẩy. Đây là tiêu chuẩn khi sử dụng phương pháp in nội dung của một mảng nguyên hàm. mỗi phần tử luôn được phân tách bằng dấu phẩy. Nếu chúng ta muốn thêm dấu cách vào giữa các dấu phẩy của mỗi giá trị, thì chúng ta sẽ phải thực hiện thêm một bước

Cũng lưu ý rằng

7 và

8 không được trình bày trên trang, nhưng chúng vẫn được phân tách bằng dấu phẩy

đầu ra

Có một div bên dưới dòng này, nơi chúng ta sẽ in các mảng ví dụ từ bài học này

Định dạng các giá trị mảng để in trong một đoạn văn

Để định dạng các giá trị mảng của chúng ta, chúng ta có thể sử dụng phương thức mảng tích hợp sẵn

9. Phương thức này sẽ biến một mảng thành một chuỗi, tách từng phần tử bằng đối số mà chúng ta truyền vào phương thức. Hãy xem một số ví dụ

> p1.innerText = numAr.join[" and "];
> p2.innerText = stringAr.join[", "];
> p3.innerText = morePrimitives.join[];

Như chúng ta có thể thấy trong hình bên dưới và phần "đầu ra" ở trên, đối số mà chúng ta chuyển vào phương thức

9 xác định cách mảng của chúng ta được nối lại với nhau thành một chuỗi

In một mảng các đối tượng

Chúng ta không thể in một mảng các đối tượng [như các đối tượng phần tử HTML] vào một trang web giống như chúng ta đã làm với một mảng các đối tượng nguyên thủy. Hãy xem một ví dụ

> const pTag = document.createElement["p"];
undefined
> const input = document.createElement["input"];
undefined
> const objArray = [pTag,input];
undefined
> p1.innerText = objArray.join[" and "];

Nếu chúng ta tìm kiếm trong phần "đầu ra" ở trên hoặc hình ảnh bên dưới, chúng ta sẽ thấy các đối tượng phần tử HTML của chúng ta không in như các đối tượng nguyên thủy.

> const numAr = [2,4,6,8];
> const stringAr = ["Rhino", "Hippo", "Dingo", "Dodo", "Flamingo"];
> const morePrimitives = [true, false, undefined, null];

0. Lưu ý rằng điều này đúng với bất kỳ đối tượng nào, không chỉ các đối tượng phần tử HTML

vậy chúng ta có thể làm gì?

Một ví dụ điển hình về việc lặp qua một mảng các đối tượng phần tử HTML là dự án Khảo sát Giao thông vận tải mà chúng ta đã sử dụng để tìm hiểu cách triển khai các hộp kiểm trước đó trong phần khóa học này. Trong dự án đó, chúng tôi đã tạo các phần tử đoạn mới cho mọi tùy chọn vận chuyển mà người dùng đã chọn và thêm từng đoạn vào DOM trong phần 'kết quả'

Làm cách nào để thêm mảng vào HTML?

Làm cách nào để in một mảng trong HTML?

Làm cách nào để hiển thị một mảng trong HTML bằng JavaScript?

Làm cách nào để tạo một mảng trong HTML?