Hướng dẫn convert html to plain text javascript - chuyển đổi html sang javascript văn bản thuần túy

Tôi đã làm việc với một trình soạn thảo văn bản phong phú vào một ngày khác và cần phải tước các thẻ HTML từ chuỗi và lưu trữ nó trong cơ sở dữ liệu. Và đây là một vài cách tôi học được có thể có ích cho bất cứ ai đang cố gắng làm điều tương tự. Những gì chúng tôi đang cố gắng làm là xóa các thẻ khỏi chuỗi và làm cho chuỗi có thể in dưới dạng văn bản thuần túy. Hãy để lặn và xem nó hoạt động như thế nào.
What we are trying to do is remove the tags from the string and make the string printable as plain text. Let’s dive in and see how it works.

1) Sử dụng .replace (/]*>/g, ‘

Phương pháp này là một cách đơn giản và hiệu quả để xóa các thẻ khỏi văn bản. Phương thức này sử dụng phương thức chuỗi .replace(old value,new value) thay thế các giá trị thẻ HTML bằng chuỗi trống. /g được sử dụng để nó xảy ra trên toàn cầu (mọi giá trị được tìm thấy trong chuỗi được thay thế bằng quy định nếu /g được sử dụng). Hạn chế của phương pháp này là chúng ta có thể loại bỏ một số thực thể HTML. Nó vẫn hoạt động tốt mặc dù.
The drawback of this method is that we can’t remove some HTML entities. It still works well though.

var myHTML= "<div><h2>Jimbo.</h2>\n<p>That's what she said</p></div>";

var strippedHtml = myHTML.replace(/<[^>]+>/g, '');

// Jimbo.
// That's what she said
console.log(stripedHtml);

Nhập chế độ FullScreenen EXIT Mode FullScreen

2) Tạo phần tử DOM tạm thời và truy xuất văn bản

Đây là cách hiệu quả nhất để thực hiện nhiệm vụ. Tạo một phần tử giả và gán nó cho một biến. Chúng ta có thể trích xuất sau bằng cách sử dụng các đối tượng phần tử. Gán văn bản HTML cho InsideHtml của phần tử giả và chúng ta sẽ lấy văn bản thuần túy từ các đối tượng phần tử văn bản.

function convertToPlain(html){

    // Create a new div element
    var tempDivElement = document.createElement("div");

    // Set the HTML content with the given value
    tempDivElement.innerHTML = html;

    // Retrieve the text property of the element 
    return tempDivElement.textContent || tempDivElement.innerText || "";
}

var htmlString= "<div><h2>Bears Beets Battlestar Galactica </h2>\n<p>Quote by Dwight Schrute</p></div>";


console.log(convertToPlain(htmlString));
// Expected Result:
// Bears Beets Battlestar Galactica 
// Quote by Dwight Schrute

Nhập chế độ FullScreenen EXIT Mode FullScreen

2) Tạo phần tử DOM tạm thời và truy xuất văn bản

Đây là cách hiệu quả nhất để thực hiện nhiệm vụ. Tạo một phần tử giả và gán nó cho một biến. Chúng ta có thể trích xuất sau bằng cách sử dụng các đối tượng phần tử. Gán văn bản HTML cho InsideHtml của phần tử giả và chúng ta sẽ lấy văn bản thuần túy từ các đối tượng phần tử văn bản.
Package.json is needed to use the package. We need to install the package first and then use it in our file.
You can find the official doc of the package here.

3) Gói NPM HTML-to-Text

npm install html-to-text

Nhập chế độ FullScreenen EXIT Mode FullScreen

2) Tạo phần tử DOM tạm thời và truy xuất văn bản

const { htmlToText } = require('html-to-text');

const text = htmlToText('<div>Nope Its not Ashton Kutcher. It is Kevin Malone. <p>Equally Smart and equally handsome</p></div>', {
    wordwrap: 130
});
console.log(text); // expected result: 
// Nope Its not Ashton Kutcher. It is Kevin Malone.

// Equally Smart and equally handsome

Nhập chế độ FullScreenen EXIT Mode FullScreen

2) Tạo phần tử DOM tạm thời và truy xuất văn bản

Đây là cách hiệu quả nhất để thực hiện nhiệm vụ. Tạo một phần tử giả và gán nó cho một biến. Chúng ta có thể trích xuất sau bằng cách sử dụng các đối tượng phần tử. Gán văn bản HTML cho InsideHtml của phần tử giả và chúng ta sẽ lấy văn bản thuần túy từ các đối tượng phần tử văn bản.