Mã hóa các thẻ HTML trong JavaScript
Các thực thể HTML có thể được giải mã bằng cách sử dụng một số phương pháp khác nhau liên quan đến thư viện JavaScript vanilla hoặc JavaScript. Hướng dẫn này sẽ chỉ đi qua các phương pháp JavaScript cơ bản để giải mã các thực thể HTML vì chúng dễ dàng và đơn giản Show
Decoding HTML Entities with the DOM ElementPhương pháp đầu tiên là sử dụng phần tử textarea. Như tên gợi ý, phần tử textarea được sử dụng để tạo một vùng văn bản đơn giản trong đó mỗi ký tự được hiểu là văn bản thuần túy đơn giản giải mã chức năng ( str ) { Trong đoạn mã trên, trước tiên chúng ta tạo phần tử textarea bằng cách sử dụng tài liệu. phương thức createElement(). Sau đó, chúng tôi đã viết chuỗi chứa các thực thể HTML bên trong vùng văn bản bằng thuộc tính InternalHTML. Bằng cách này, chuỗi sẽ được chuyển đổi thành văn bản đơn giản và các thực thể sẽ được chuyển đổi thành ký tự. Cuối cùng, chúng tôi đã trả về chuỗi được lưu trữ bên trong biến txt là vùng văn bản Bây giờ nếu chúng ta gọi hàm giải mã với một thực thể HTML làm tham số, nó sẽ trả về nó dưới dạng văn bản đơn giản let encodedStr = "; Giải mã các thực thể HTML với DOMParser. phương thức parseFromString()Phương pháp thứ hai là sử dụng DOMParser. phương thức parseFromString(). DOMParser. parseFromString() lấy một chuỗi chứa HTML và trả về nó dưới dạng một phần tử HTML giải mã chức năng ( str ) { Trong đoạn mã trên, trước tiên chúng ta chuyển chuỗi dưới dạng đối số cho DOMParser. parseFromString() và lấy lại nó dưới dạng một phần tử HTML bằng cách chỉ định đối số thứ hai là “text/html”. Sau đó, chúng tôi đã trả về nội dung văn bản của phần tử HTML mới được tạo Bây giờ gọi hàm giải mã() let encodedStr = "; Phần kết luậnCác thực thể HTML là cần thiết để xem đúng văn bản trên các trang web. Một số trang web chứa các đoạn mã dưới dạng văn bản đơn giản. Nếu không có Thực thể, sẽ rất khó để phân biệt đâu là mã HTML cho trang web và đâu chỉ là văn bản thuần túy Thí dụMã hóa một URI hãy để uri = "bài kiểm tra của tôi. asp?name=ståle&car=saab"; Định nghĩa và cách sử dụngPhương thức cú phápThông sốTham sốMô tảuriBắt buộcURI để mã hóa Giá trị trả vềLoạiMô tảMột chuỗi. URI được mã hóaHỗ trợ trình duyệt
ES1 (JavaScript 1997) được hỗ trợ đầy đủ trên mọi trình duyệt HTML contains special characters such as ‘<,’ ‘>,’ ‘/,’ and many more such as single and double commas. These special characters are used for the HTML tag, such as ‘<’ is used to open the HTML tag. The ‘/’ and ‘>’ is used to close the HTML tag. This tutorial teaches us to escape HTML special characters in JavaScript. Bây giờ, câu hỏi đặt ra là nếu chúng ta muốn sử dụng các ký tự này bên trong nội dung HTML thì sao? Ví dụ: chúng ta cần hiển thị chuỗi bên dưới cho trình duyệt tutorialsPoint Nếu chúng tôi thêm trực tiếp chuỗi trên vào HTML, nó được coi là thẻ in đậm nhưng chúng tôi muốn sử dụng nó dưới dạng chuỗi Để khắc phục vấn đề trên, chúng ta phải sử dụng Unicode cho tất cả các ký tự đặc biệt. Ở đây, chúng tôi sẽ thay thế tất cả các ký tự đặc biệt bằng Unicode để thoát khỏi các ký tự đặc biệt HTML và sử dụng chúng bên trong chuỗi HTML Có nhiều cách tiếp cận khác nhau để giải quyết vấn đề trên được đưa ra dưới đây
Sử dụng phương thức createTextNode()Trong cách tiếp cận này, chúng ta sẽ sử dụng phương thức createTextNode() từ HTML DOM. Chúng ta chỉ cần truyền chuỗi cho phương thức làm đối số, phương thức này trả về chuỗi được mã hóa cú phápVar converted_string = document.createTextNode(string); Thông số
ví dụ 1Ví dụ dưới đây minh họa việc sử dụng phương thức createTextNode(string) trong JavaScript
Đối với đầu ra ví dụ trên, người dùng có thể quan sát thấy rằng chúng tôi đã tạo một chuỗi được mã hóa bằng cách sử dụng phương thức createTextNode() và chèn nó vào HTML DOM. Nó hiển thị các ký tự đặc biệt mà không coi chúng là một thành phần thẻ Sử dụng thuộc tính textContentChúng ta có thể tạo một phần tử HTML trong JavaScript và thêm chuỗi HTML. Chúng ta có thể sử dụng thuộc tính textContent của phần tử HTML Textarea và chèn chuỗi HTML. Sau đó, chúng ta có thể lấy chuỗi được mã hóa bằng Unicode bằng thuộc tính innerHTML cú pháplet textAreaDiv = document.createElement( 'textarea' ); textAreaDiv.textContent = HTML_String; let encoded_string = textAreaDiv.innerHTML; Thông số
ví dụ 2Người dùng có thể làm theo ví dụ dưới đây để xem trình diễn của phương pháp trên
Người dùng có thể thấy trong đầu ra bên dưới cách chúng tôi có thể mã hóa chuỗi bằng thuộc tính textContent Sử dụng phương thức Replace()Trong cách tiếp cận này, chúng ta sẽ sử dụng phương thức replace() của JavaScript. Chúng ta có thể sử dụng phương thức replace() để thay thế ký tự này bằng ký tự khác. Ở đây, chúng ta sẽ thay thế tất cả các ký tự đặc biệt trong chuỗi HTML bằng Unicode của chúng bằng cách sử dụng phương thức replace() cú pháphtml_string.replace( old_char, new_char ) Thông số
ví dụ 3Ví dụ dưới đây minh họa cách chúng ta có thể mã hóa chuỗi HTML bằng cách thay thế các ký tự đặc biệt bằng phương thức replace()
Người dùng có thể thấy rằng chúng tôi đã thay thế thành công tất cả các ký tự đặc biệt bằng cách sử dụng phương thức thay thế và chúng tôi có thể hiển thị chuỗi nguyên trạng với các ký tự đặc biệt Phần kết luậnTrong hướng dẫn này, chúng ta đã học được ba cách để thay thế các ký tự đặc biệt trong HTML. Người dùng có thể sử dụng bất kỳ phương pháp nào theo yêu cầu của họ Làm cách nào để mã hóa các thẻ HTML trong JavaScript?Sử dụng thuộc tính textContent
. Chúng ta có thể sử dụng thuộc tính textContent của phần tử HTML Textarea và chèn chuỗi HTML. Sau đó, chúng ta có thể lấy chuỗi được mã hóa bằng Unicode bằng thuộc tính innerHTML.
Làm cách nào để mã hóa và giải mã các thẻ HTML trong JavaScript?JavaScript không có phương thức nào để mã hóa và giải mã các thực thể HTML, vì vậy bạn có thể sử dụng các hàm này. . Giải mã thực thể HTML. chức năng giải mãHTMLEntities(văn bản) {. Giải mã thực thể HTML (JQuery) function decodeHTMLEntities(text) {. Mã hóa thực thể HTML. chức năng mã hóa HTMLEntities (văn bản) {. Mã hóa thực thể HTML (JQuery) Làm cách nào để giải mã thẻ HTML trong JavaScript?Giải mã thực thể HTML với phần tử DOM createElement() method. Then we wrote the string containing HTML entities inside the textarea using innerHTML property. This way the string will be converted to simple text and entities will be converted to characters.
Làm cách nào để mã hóa các ký tự đặc biệt HTML trong JavaScript?Phương thức encodeURI() mã hóa một URI. . Ghi chú. Sử dụng phương thức decodeURI() để giải mã URI Ký tự đặc biệt. Phương thức encodeURI() không mã hóa các ký tự như. , / ?. @ & = + $ * #. Xem thêm. Phương thức encodeURIComponent() để mã hóa URI. Phương thức decodeURIComponent() để giải mã URI |