首頁 >web前端 >js教程 >如何僅使用純 JavaScript 從文字中刪除 HTML 標籤?

如何僅使用純 JavaScript 從文字中刪除 HTML 標籤?

Barbara Streisand
Barbara Streisand原創
2024-12-25 10:23:14330瀏覽

How Can I Remove HTML Tags from Text Using Only Plain JavaScript?

在純JavaScript 中剝離HTML 標籤:全面探索

從文字中剝離HTML 標籤是各種程式設計應用程式中的常見要求。雖然 JavaScript 提供了幾種內建方法和函式庫來完成此任務,但本文深入研究了使用純 JavaScript 實作此任務的複雜細節,無需外部依賴。

在缺乏 jQuery 或基於正規表示式的解決方案等函式庫的情況下,最直接的方法是利用瀏覽器的固有功能來處理 HTML。透過建立臨時文件片段並將 HTML 指派給其 insideHTML 屬性,瀏覽器可以無縫解析內容並傳回不帶任何標籤的文字。

以下 JavaScript 函數舉例說明了這種方法:

function stripHtml(html) {
    let tmp = document.createElement("DIV");
    tmp.innerHTML = html;
    return tmp.textContent || tmp.innerText || "";
}

該函數將 HTML 字串作為輸入並傳回純文字。然而,值得注意的是,不鼓勵在使用者產生的 HTML 上使用此方法,因為它可能會導致惡意程式碼執行。

對於這些情況,更安全的方法是利用DOMParser,這是一個引入的API在HTML5 中:

function stripHtml(html) {
    const parser = new DOMParser();
    const document = parser.parseFromString(html, "text/html");
    return document.documentElement.textContent;
}

此函數使用DOMParser 從HTML 字串建立文件對象,然後從文件的根元素中提取文字內容。這種方法提供了增強的安全性和對輸入的控制,使其適合處理潛在不受信任的 HTML。

選擇適當的技術取決於特定的用例和安全考慮。對於大多數場景,使用innerHTML 的第一種方法既簡單又有效率。但是,如果處理不受信任的輸入,建議使用 DOMParser 以提高安全性和可靠性。

以上是如何僅使用純 JavaScript 從文字中刪除 HTML 標籤?的詳細內容。更多資訊請關注PHP中文網其他相關文章!

陳述:
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn