Hướng dẫn what does append in javascript mean? - append trong javascript nghĩa là gì?

GIỚI THIỆU VỀ JAVASCRIPT

JavaScript append là một trong những phương thức hữu ích được sử dụng để chèn nội dung cần thiết ở vị trí cuối của các phần tử được chọn cụ thể. Phương thức append () rất hữu ích để tạo nội dung với sự trợ giúp của HTML, jQuery cũng như DOM. Người ta có thể chèn nội dung bằng cách chỉ định tham số ở cuối phần tử đã cho theo các phần tử phù hợp. Phương pháp này giúp người dùng tránh mã hóa cứng trong mã HTML thực tế của họ. Vì vậy, người ta có thể thêm mã yêu cầu trực tiếp ở cuối phần tử bằng cách sử dụng các hàm javascript append () JQuery giúp thêm các hàm hoặc nội dung nối tiếp theo chuỗi HTML, phần tử DOM, đối tượng jQuery hoặc nút văn bản, v.v.

Syntax:

• Bây giờ sẽ thấy cú pháp để thêm phần tử vào mã bằng cách sử dụng mã JavaScript vào phần tử DIV bằng cách sử dụng các kỹ thuật mô hình đối tượng tài liệu (DOM). Vì vậy, sử dụng điều này, chúng ta có thể tạo trống có một số ID bên trong mã HTML, trong ID kịch bản này sẽ hữu ích để tìm nạp để nó sẽ thao tác với văn bản bên trong cho div này.
• Dưới đây là cú pháp cho phương thức phụ lục JavaScript như sau:

document. getElementById("div_name").innerText +=  "data" ;

• Chúng ta cũng có thể sử dụng jQuery, để nối thêm nội dung ở cuối các phần tử đã chọn, bằng cách sử dụng cú pháp sau:

$(selector).append(content , function(index.html))

• Nội dung cú pháp trên là tham số cần thiết vào cú pháp, được sử dụng để chèn vào các thẻ HTML, các giá trị có thể cho đây là các phần tử HTML, đối tượng jQuery, các phần tử DOM, v.v. và hàm bao gồm ở đây là hàm (INDEX, HTML) được coi là một thuật ngữ tùy chọn, nó sẽ bao gồm một hàm sẽ trả về nội dung để chèn. Ở đây, hai giá trị đó xác định các ý nghĩa khác nhau như chỉ mục được sử dụng để trả về vị trí của phần tử trong khi HTML trả về HTML hiện tại của phần tử đã chọn.

JavaScript có hoạt động như thế nào trong HTML?

• Như trước đó, chúng ta đã thấy rằng phương thức append () được sử dụng để thêm phần tử ở cuối danh sách phần tử, bây giờ chúng ta sẽ thấy thực sự nó sẽ hoạt động như thế nào với các loại của nó để làm điều đó.
• Có hai cách trong JavaScript giúp nối mã HTML vào DIV. Hãy cùng xem cả hai người họ một cách chi tiết:

1. Sử dụng thuộc tính bên trong

Đây là loại đầu tiên mà chúng ta có thể nối phần tử bằng cách sử dụng thuộc tính bên trong, vì vậy trong khi xử lý trước tiên, chúng ta phải chọn phần tử trong đó thực sự chúng ta muốn nối lại mã. Sau đó, hãy thêm mã này trong định dạng mã kèm theo dưới dạng chuỗi cùng với toán tử += trên bên trong. Dưới đây là cú pháp để sử dụng bên trong như sau:

element.innerHTML += "HTML code"

Hoặc bạn cũng có thể sử dụng như:

element.innerHTML = element.innerHTML + "HTML Code"

2. Sử dụng phương thức insertAdjacenthtml ()

Nếu chúng tôi muốn nối mã HTML của chúng tôi vào div thì chúng tôi sẽ sử dụng phương thức insertAdjacenthtml (), vì vậy trong quá trình này, bạn phải chọn một phần tử bên trong div để chèn mã. Vì vậy, quá trình có thể được hoàn thành bằng cách sử dụng hai tham số như sau:

• Vị trí sẽ xác định vị trí mà thực sự chúng tôi muốn thêm mã. Đây là những giá trị như Afterbegin, trước đó, sau đó, trước khi như thế.

• Ngoài ra, hãy xem xét mã HTML mà bạn muốn chèn các trích dẫn vào định dạng kèm theo.

Cú pháp:

elementInsideDiv.insertAdjacentHTML('afterbegin');

• Một điều thú vị hơn chúng ta có thể làm với phương thức trợ giúp của phương thức append () là xử lý phương thức appendChild () để nó nối một nút từ danh sách là đứa con cuối cùng của một nút. Vì vậy, chúng tôi sẽ thấy chi tiết cách sử dụng phương thức phụ lục () sẽ hoạt động trong javaScript với sự trợ giúp của ví dụ sau:
• Giả sử chúng ta sẽ thêm nội dung ở cuối danh sách, thì nó sẽ giống như:

var child = document.createElement("li");
var demo = document.createTextNode("Example");
child.appendChild(demo);
document.getElementById("childdemo").appendChild(child);

Ví dụ về JavaScript

Sau đây là các ví dụ của JavaScript phụ thuộc:

Ví dụ 1

Trong ví dụ này, chúng tôi đang tạo mã đơn giản bằng nút Nhấp vào Nó sẽ hiển thị phần tử được thêm vào cuối cùng vào danh sách trên nút Nhấp như hiển thị bên dưới:

Code:

Example of Appending item.
Appending list items in List.

Example 1
Example 2
Example 3

Example of Appending Text
Example of Appending list

Output:

Sau khi nhấp vào ví dụ về nút nối thêm nút

Sau khi nhấp vào ví dụ về nút Danh sách nối tiếp

Ví dụ #2

Trong ví dụ này, chúng tôi sẽ tạo danh sách các đối tượng, trong đó nó sẽ hiển thị mục được chèn cuối cùng thông qua phương thức nối JavaScript, mã cho nó như sau:

Code:

Preparing Subject List 


Enter Subjects:




Add Subjects



List of Subjects as:

Output:

Sau khi thêm các đối tượng

Ví dụ #3

Đây là ví dụ mà chúng tôi đang làm việc với phương thức JavaScript appendChild () để xử lý trình diễn mã. Mã cho điều này như sau:

Code:

JavaScript Append 
This is the example where we are working with P tag from HTML. So whenever we are going to click button so it will display text from P tag.
Click Here

Output:

Sau khi nhấp vào nút, nó sẽ hiển thị cho con được thêm vào thẻ làm đầu ra như sau:

Sự kết luận

Vì vậy, từ tất cả các chi tiết trên, chúng tôi đã biết rằng phương thức JavaScript append () được sử dụng để thêm phần tử ở vị trí cuối của danh sách đã chọn. Có thể hữu ích cho các khía cạnh khác nhau như các yếu tố HTML, jQuery và Dom. Nó cũng có thể nối các phần tử vào mã bằng cách sử dụng mã jQuery. Người ta cũng có thể phụ lục () cho mục đích nối tiếp.

Bài viết đề xuất

Đây là một hướng dẫn để nối thêm JavaScript. Ở đây chúng tôi cũng thảo luận về cách thức nối tiếp JavaScript hoạt động trong HTML cùng với các ví dụ khác nhau và việc triển khai mã của nó. Bạn cũng có thể xem các bài viết sau để tìm hiểu thêm -

1. Kế thừa trong JavaScript
2. Sự kiện bàn phím JavaScript
3. Con trỏ JavaScript
4. Hộp thông báo JavaScript