Bài jQuery 15: Cách Insert nội dung trong jQuery

0
287

Xin chào các bạn, trong bài học hôm nay mình sẽ giới thiệu đến các bạn cách Insert nội dung trong jQuey.

Insert một nội dung mới

jQuery cung cấp một số phương thức, như append(), Prepend(), html(), text(), before(), after(),  v.v. cho phép chúng ta chèn nội dung mới bên trong một phần tử hiện có.

Các phương thức jQuery html() text() đã được mình giới thiệu trong các bài học trước, vì vậy trong chương này, chúng ta sẽ thảo luận về phần còn lại của chúng.

Phương thức append()

Phương thức append() của jQuery được sử dụng để chèn nội dung vào cuối các phần tử được chọn.

Ví dụ sau đây sẽ nối thêm một số nội dung vào các thẻ <p>:

Phương thức prepend()

Phương thức Prepend() được sử dụng để chèn nội dung vào đầu các phần tử được chọn.

Ví dụ sau đây sẽ thêm nội dung vào trên đầu các đoạn văn:

Insert nhiều phần tử với phương thức append() & prepend()

Phương thức append()preend() cũng hỗ trợ nhận nhiều đối số làm đầu vào.

Đoạn code jQuery trong ví dụ sau sẽ chèn một phần tử <h1>, <p> và phần tử <img> bên trong phần tử <body>.

Phương thức before() và after()

Phương thức before() được sử dụng để chèn nội dung trước các phần tử được chọn. Còn phương thức after() thì chèn nội dung vào sau các phần tử được chọn.

Ví dụ:

Kết luận

Như vậy trong bài học ngày hôm nay mình đã giới thiệu đến các bạn Cách Insert nội dung trong jQuery. Trong bài học tiếp theo chúng ta sẽ cùng nhau tìm hiểu về Cách xóa một phần tử hoặc thuộc tính trong jQuery.

Chúc các bạn học tập tốt!

BÌNH LUẬN

Vui lòng nhập bình luận của bạn
Vui lòng nhập tên của bạn ở đây