Phương thức append() trong JavaScript

• Bùi Tấn Lực
• 144
• 12/09/2025

Phương thức append() trong JavaScript dùng để thêm chữ vào phía sau các phần tử con trong phần tử HTML hoặc thêm phần tử html vào phía sau, chi tiết như nào hãy cùng chúng tôi phân tích:

Phương thức append() trong JavaScript

Chức năng của Phương thức append() trong JavaScript

Phương thức append() trong JavaScript dùng để thêm chữ vào phía sau các phần tử con trong phần tử HTML hoặc thêm phần tử html vào phía sau các phần tử con của phần tử HTML khác.

Cú pháp của Phương thức append() trong JavaScript

tenbien.append("chu");

tenbien: Tên biến là phần tử HTML dùng để thêm chữ sau các phần tử con trong phần tử này, thường dùng document.getElementById("giá trị id") để lấy.

chu: Thêm chữ vào.

tenbien.append(phantu);

tenbien: Tên biến là phần tử HTML dùng để thêm phần tử sau các phần tử con trong phần tử này, thường dùng document.getElementById("giá trị id") để lấy.

phantu: Phần tử mới tạo.

Code Phương thức append() trong JavaScript

Phương thức append() chữ trong JavaScript

Thêm chữ vào phía sau các phần tử con trong phần tử HTML:

document.getElementById("divid").append("Xin chào!.");

<div id="divid" style="border:1px solid red;padding:20px;">Thêm chữ vào phía sau các phần tử con trong ô này!</div>
<p>Nhấn vào nút Append để thêm chữ "Xin chào!." vào phía sau các phần tử con trong ô đỏ.</p>
<button onclick="themChu()">Append</button>
<script>
function themChu() {
const divid = document.getElementById("divid");
divid.append("Xin chào!.");
}
</script>

Chạy Thử

Phương thức append() phần tử html trong JavaScript

Thêm phần tử html vào phía sau các phần tử con trong phần tử HTML khác:

document.getElementById("divid").append(h2);

<div id="divid" style="border:1px solid red;padding:20px;">Thêm phần tử HTML vào phía sau các phần tử con trong ô này!</div>
<p>Nhấn vào nút Append để thêm phần tử h2 vào sau các phần tử con trong ô đỏ</p>
<button onclick="themPhanTu()">Append</button>
<script>
function themPhanTu() {
const divid = document.getElementById("divid");
// Tạo phần tử h2
const h2 = document.createElement("h2");
// Thêm phần tử h2 vào phía sau các phần tử con trong phần tử id divid
divid.append(h2);
// Thêm chữ vào phần tử h2
h2.append("Tiêu đề h2");
}
</script>

Chạy Thử

Lời kết

Cảm ơn các bạn đã tham khảo bài viết Phương thức append() trong JavaScript.

Bùi Tấn Lực

Chia sẻ nội dung đánh giá của bạn về Phương thức append() trong JavaScript
Email, Điện thoại của bạn sẽ không được hiển thị công khai. Các trường bắt buộc được đánh dấu *

Đăng ký tư vấn miễn phí

Tìm hiểu 1 năm không bằng lắng nghe 1 câu tư vấn