Hướng dẫn append html jquery - thêm jquery html

• Trang chủ
• Tham khảo
• jQuery
• jQuery - function
• .append()

Định nghĩa và sử dụng

• .append() Chèn nội dung, di chuyển thành phần vào trong thành phần khác, nội dung này thường được sắp xếp ở vị trí sau cùng.

Cấu trúc

• Đã được thêm vào từ phiên bản 1.0

.append(nội dung)nội dung)

$('div').append('
nội dung thêm vào
');
$('div').append($('h3'));

• Đã được thêm vào từ phiên bản 1.4

.append(nội dung)nội dung)

Đã được thêm vào từ phiên bản 1.4

Thành phần div

Html viết:

Hiển thị trình duyệt:append thì thành phần div được chèn thêm thành phần

nội dung thêm vào

vào ngay vị trí sau cùng của thành phần div.

Ban đầu nội dung chỉ có thành phần div, nhưng khi sử dụng append thì thành phần div được chèn thêm thành phần nội dung thêm vào vào ngay vị trí sau cùng của thành phần div.

So sánh code HTML trước và sau khi có jQuery:	Trước khi có jQuery
Sau khi có jQuery	Thành phần div nội dung thêm vào

Thành phần div nội dung thêm vào

Đã được thêm vào từ phiên bản 1.4

thành phần h3
thành phần p

Html viết:

Hiển thị trình duyệt:

Ban đầu nội dung chỉ có thành phần div, nhưng khi sử dụng append thì thành phần div được chèn thêm thành phần nội dung thêm vào vào ngay vị trí sau cùng của thành phần div.

So sánh code HTML trước và sau khi có jQuery:	Trước khi có jQuery
Sau khi có jQuery thành phần h3 thành phần p	Thành phần div thành phần p thành phần h3

.append(function(index){...})

Đã được thêm vào từ phiên bản 1.4

thành phần div 01
thành phần div 02

Html viết:

Hiển thị trình duyệt:

Ban đầu nội dung chỉ có thành phần div, nhưng khi sử dụng append thì thành phần div được chèn thêm thành phần nội dung thêm vào vào ngay vị trí sau cùng của thành phần div.

So sánh code HTML trước và sau khi có jQuery:	Trước khi có jQuery
Sau khi có jQuery thành phần div 02	Thành phần div test01 thành phần div 02 test02

1) Phương thức append() trong jQuery

- Phương thức append() dùng để thêm nội dung vào vị trí cuối cùng bên trong phần nội dung của phần tử được chọn.append() dùng để thêm nội dung vào vị trí cuối cùng bên trong phần nội dung của phần tử được chọn.

- Thêm nội dung từ cơ bản đến nâng cao vào vị trí cuối cùng bên trong phần nội dung của tất cả các phần tử khi người dùng click vào một nút.từ cơ bản đến nâng cao vào vị trí cuối cùng bên trong phần nội dung của tất cả các phần tử

khi người dùng click vào một nút.

---

Xem ví dụ

4) Điểm giống & khác giữa appendTo() và append()

2) Cách sử dụng phương thức append() trong jQuery

- Để sử dụng phương thức append(), ta dùng cú pháp như sau:append(), ta dùng cú pháp như sau:

$(selector).append(content);

- Dưới đây là bảng mô tả ý nghĩa & cách sử dụng các tham số trong phương thức append():append():

Tham số	Yêu cầu	Mô tả ý nghĩa & cách sử dụng
content	Bắt buộc	- Nội dung mà bạn muốn thêm vào. - Nội dung đó có thể là: Phần tử HTML Phần tử DOM Đối tượng jQuery ....

3) Một số ví dụ

---

Xem ví dụ

4) Điểm giống & khác giữa appendTo() và append()

- Dưới đây là bảng mô tả điểm giống và khác giữa phương thức appendTo() và append():

	appendTo()	append()
Điểm giống	- Cả hai phương thức đều được dùng để thêm nội dung vào vị trí cuối cùng bên trong phần nội dung của phần tử.
Điểm khác	- Nội dung thêm vào bắt buộc phải là phần tử HTML (tức là phải bắt đầu bằng thẻ và kết thúc bởi thẻ)	- Nội dung thêm vào không bắt buộc phải là phần tử HTML
- Bộ chọn đặt ở phía sau	- Bộ chọn đặt ở phía trước